@import '_content/Blazored.Modal/Blazored.Modal.bundle.scp.css';
@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';

/* /Components/Blocks/CountdownTimer.razor.rz.scp.css */
.countdown-timer[b-33fo71ev4q] {
    /* Default: horizontal layout */
    flex-direction: row;
    font-size: 1rem;
}

@media (max-width: 576px) {
    .countdown-timer[b-33fo71ev4q] {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        padding: 1rem 0.5rem;
        font-size: 0.95rem;
    }
    .countdown-timer .icon-wrap[b-33fo71ev4q] {
        display: none !important;
    }
    .countdown-timer .countdown-badges[b-33fo71ev4q] {
        flex-wrap: wrap;
        justify-content: center !important;
        margin-top: 0.5rem;
    }
    .countdown-timer .badge[b-33fo71ev4q] {
        margin-left: 0.25rem !important;
        margin-right: 0.25rem !important;
        margin-bottom: 0.25rem;
        font-size: 1em;
    }
    .countdown-timer .countdown-wrapper[b-33fo71ev4q] {
        margin-top: 0.5rem;
    }
}

.countdown-timer[b-33fo71ev4q] {
    /* keep layout tidy; visual styling uses Bootstrap classes (alert-*, bg-*, badge-*) */
    --ct-icon-size: 3rem;
}

.countdown-timer .icon-wrap[b-33fo71ev4q] {
    width: var(--ct-icon-size);
    height: var(--ct-icon-size);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: .5rem;
    /* allow Bootstrap bg-* classes to provide background color */
}

.countdown-badges .badge[b-33fo71ev4q] {
    font-weight: 600;
    font-size: 0.85rem;
    padding: 0.35rem 0.5rem;
}

.countdown-wrapper[b-33fo71ev4q] {
    display: none; /* hide by default, show in text-only mode */
    color: var(--bs-body-color);
}

/* subtle elevation when danger to emphasize theme */
.alert-danger.countdown-timer[b-33fo71ev4q] {
    box-shadow: 0 6px 18px rgba(var(--bs-danger-rgb, 220, 53, 69), 0.06);
}


.badge[b-33fo71ev4q] {
    width: 4em;
}

/* TEXT-ONLY MODE: strip backgrounds, icons, badges and use plain inline text */
.text-only .countdown-timer[b-33fo71ev4q] {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: .4rem 0 !important;
    align-items: center;
}

    .text-only .countdown-timer .icon-wrap[b-33fo71ev4q] {
        display: none !important;
    }

    .text-only .countdown-timer .countdown-badges[b-33fo71ev4q],
    .text-only .countdown-timer .countdown-badges .badge[b-33fo71ev4q] {
        display: none !important;
    }

    .text-only .countdown-timer .small[b-33fo71ev4q] {
        color: var(--bs-body-color) !important;
        opacity: 0.9;
    }

    .text-only .countdown-timer .countdown-text[b-33fo71ev4q] {
        font-weight: 600;
        color: var(--bs-body-color);
    }

    .text-only .countdown-timer .countdown-wrapper[b-33fo71ev4q] {
        color: var(--bs-body-color);
        display: inline-block;
    }

/* small screens: slightly smaller icon and badges */
@media (max-width: 576px) {
    :root[b-33fo71ev4q] { --ct-icon-size: 2.2rem; }
    .countdown-badges .badge[b-33fo71ev4q] { font-size: 0.75rem; padding: 0.25rem 0.4rem; }
}
/* /Components/Blocks/FAQBlock.razor.rz.scp.css */
.text-only .rounded-pill.text-bg-secondary[b-5ivrnpknwr] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    color: rgba(var(--bs-body-bg-rgb),1) !important
}

/* /Components/Blocks/HotelRequestBlock.razor.rz.scp.css */
/* Ensure accessible-room check icon is green across themes.
   Uses Bootstrap CSS variable when present, falls back to a safe green. */
.accessible-yes[b-wrvzhfpzur] {
    color: #198754 !important;
    -webkit-text-fill-color: #198754 !important;
}

.text-only .accessible-yes[b-wrvzhfpzur] {
    color: var(--text-body) !important;
    -webkit-text-fill-color: var(--text-body) !important;
}

.text-only .text-danger[b-wrvzhfpzur] {
    color: var(--text-body) !important;
    -webkit-text-fill-color: var(--text-body) !important;
}
/* /Components/Blocks/NewsBlock.razor.rz.scp.css */

.text-only .rounded-pill.text-bg-secondary[b-p39m8934g9] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    color: rgba(var(--bs-body-bg-rgb),1) !important
}
/* /Components/Blocks/NotificationItem.razor.rz.scp.css */
.card[b-vuncuszjr7] {
    background-color: transparent;
    margin-bottom: 0.5rem;
    padding: 0;
}

.card-header[b-vuncuszjr7] {
    padding: 0.4rem 0.75rem;
}

.card-body[b-vuncuszjr7] {
    padding: 0.5rem 0.75rem;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.card-footer[b-vuncuszjr7] {
    padding: 0.4rem 0.75rem;
}

.card-header .fw-bold[b-vuncuszjr7] {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.card-footer .btn[b-vuncuszjr7],
.card-footer .dropdown-toggle[b-vuncuszjr7],
.card-footer .form-control[b-vuncuszjr7],
.card-footer .form-label[b-vuncuszjr7] {
    font-size: 0.72rem;
}

.card-footer .btn[b-vuncuszjr7] {
    line-height: 1.2;
}

@media (max-width: 575.98px) {
    .card-footer .btn-group[b-vuncuszjr7] {
        display: flex;
        flex-direction: column;
        gap: 0.35rem;
    }

    .card-footer .btn-group > .btn[b-vuncuszjr7],
    .card-footer .btn-group > .btn-group[b-vuncuszjr7] {
        width: 100%;
    }

    .card-footer .dropdown-menu[b-vuncuszjr7] {
        width: 100%;
        min-width: 0 !important;
    }
}

.border-danger[b-vuncuszjr7] {
    border-color: var(--theme-danger) !important;
}

.text-danger[b-vuncuszjr7] {
    color: var(--theme-danger) !important;
}

/* /Components/Blocks/NotificationPanel.razor.rz.scp.css */
/* Outer dropdown wrapper — sits in flex utility bar */
.dropdown.d-flex[b-wu1keaey76] {
    align-self: center;
}

.notifications-dropdown-toggle .bi[b-wu1keaey76] {
    font-size: 0.95rem;
}

/* Match notification button to nav utility button style */
.notifications-dropdown-toggle[b-wu1keaey76] {
    background-color: var(--board-amber) !important;
    border: 1px solid var(--board-amber) !important;
    color: var(--theme-dark-page-bg) !important;
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.78rem;
    height: 30px;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    line-height: 1;
    align-self: center;
    transition: background 120ms, color 120ms, border-color 120ms;
}

.notifications-dropdown-toggle:hover[b-wu1keaey76],
.notifications-dropdown-toggle:focus-visible[b-wu1keaey76] {
    background-color: #ffd54f !important; /* lighter amber */
    border-color: #ffe082 !important;
    color: #222a35 !important;
}
}
.notifications-dropdown-toggle:hover .ma-badge[b-wu1keaey76],
.notifications-dropdown-toggle:focus-visible .ma-badge[b-wu1keaey76] {
    background: #ffd54f !important; /* lighter amber to match button hover */
    color: #222a35 !important;
}



.badge[b-wu1keaey76] {
    z-index:100;
}

.ma-badge[b-wu1keaey76] {
    background: #b71c1c !important; /* Deep red for notification count */
    color: #fff !important;
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.72rem;
    border-radius: 8px;
    padding: 0.15em 0.5em;
    min-width: 1.5em;
    text-align: center;
    box-shadow: 0 1px 4px rgba(0,0,0,0.18);
}

.notifications-dropdown-toggle .badge[b-wu1keaey76] {
    top: 0.2rem !important;
}

.notifications-dropdown-toggle .translate-middle[b-wu1keaey76] {
    transform: translate(-50%, -35%) !important;
}
.dropdown-menu[b-wu1keaey76] {
        padding: 0;
        margin: 0;
        font-size: var(--bs-dropdown-font-size);
        color: var(--bs-dropdown-color);
        text-align: left;
        list-style: none;
        background-color: var(--bs-dropdown-bg);
        background-clip: padding-box;
        border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);
        border-radius: var(--bs-dropdown-border-radius);
        z-index: 1050 !important;
    }

.notification-panel-list[b-wu1keaey76] {
    width: min(100vw - 1rem, 400px);
    max-height: 70vh;
    overflow-y: auto;
    z-index: 1050; /* Ensure it's above other elements */
    position: relative;
    padding-bottom: 5px; /* Add bottom padding for button and border visibility */
}

.notification-panel-scroll[b-wu1keaey76] {
    max-height: 50vh;
    overflow-y: auto;
    padding: 5px 10px 0px 10px; /* Remove bottom padding to avoid double spacing */
    -ms-scrollbar-base-color: var(--theme-dark-btn-bg);
    scrollbar-base-color: var(--theme-dark-btn-bg);
}
/* /Components/Blocks/OrderBlock.razor.rz.scp.css */
h3[b-m09uoz6z00] {
    padding-top:0px;
}

.text-only .text-bg-primary[b-m09uoz6z00] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    color: rgba(var(--bs-body-bg-rgb),1) !important;
}

.order-cost-badge[b-m09uoz6z00] {
    position: absolute;
    bottom: 1rem;
    right: 1.5rem;
}

@media (max-width: 576px) {
    .order-block-body[b-m09uoz6z00] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: static !important;
    }
    .order-cost-badge[b-m09uoz6z00] {
        position: static !important;
        margin-top: 1rem;
        width: 100%;
        display: flex;
        justify-content: flex-start;
    }
}
/* /Components/Blocks/ProductBlock.razor.rz.scp.css */
.card-text[b-b01opej83m]  div p {
    margin-bottom: 0;
}

.card-footer h4[b-b01opej83m] {
    margin-top: 0.5em !important;
    margin-bottom: 0.5em !important;
    padding: 0;
}

.text-only .product-image[b-b01opej83m] {
    background-color: transparent !important;
    border-radius: unset !important;
    box-shadow: unset !important;
    border: 1px solid var(--bs-border-color-translucent) !important;
}

.product-image[b-b01opej83m] {
    overflow: hidden; /* keep rotated bar clipped to image area */
    border: 1px solid var(--bs-border-color-translucent) !important;
}

/* the rotated overlay bar */
.product-overlay[b-b01opej83m] {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 160%; /* long enough to cross corners */
    height: clamp(2.8rem, 12%, 3.6rem); /* responsive thickness */
    background-color: var(--theme-danger);
    opacity: 0.78;
    transform: translate(-50%, -50%) rotate(-45deg);
    z-index: 1;
    pointer-events: none; /* allow clicks to pass through */
    border-radius: 0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
}

.overlay-text[b-b01opej83m] {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(-45deg); /* counter the overlay rotation */
    z-index: 1;
    pointer-events: none;
    white-space: nowrap;
}

/* the visible "bar" behind the text so it reads cleanly */
.overlay-text span[b-b01opej83m] {
    display: inline-block;
    opacity:1;
    color: var(--theme-dark-accent);
    padding: 0.35rem 0.9rem;
    font-weight: 700;
    font-size: 1.3rem;

}

/* smaller screens: slightly smaller text and padding */
@media (max-width: 576px) {
    .product-overlay[b-b01opej83m] {
        height: clamp(1.6rem, 10%, 2.6rem);
    }

    .overlay-text span[b-b01opej83m] {
        font-size: 0.9rem;
        padding: 0.25rem 0.6rem;
    }
}

.product-image a[b-b01opej83m] {
    border: none;
    padding-bottom: 0;
    color:transparent;

}
/* /Components/Blocks/ProductImageBlock.razor.rz.scp.css */
.img-thumbnail[b-5h5ju8cp2p] {
    height: 200px;
    width: auto;
}

@media (max-width: 576px) {
    .img-thumbnail[b-5h5ju8cp2p] {
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 1rem;
    }
}
/* /Components/Blocks/ShoppingBasketBlock.razor.rz.scp.css */
.card-body[b-00fuve1vqm] {
    padding-top: 25px;
    padding-bottom: 25px;
}


.text-only .alert[b-00fuve1vqm] {
    background-color: var(--bs-body-bg) !important;
    border-color: var(--bs-border-color-translucent);
    color: var(--bs-body-color);
}

.text-only .text-primary-emphasis[b-00fuve1vqm] {
    color: var(--bs-body-color) !important;
}

.btn-group.top button[b-00fuve1vqm]{
    border-end-end-radius: 0px;
    border-end-start-radius: 0px;
}

.btn-group.bottom button[b-00fuve1vqm] {
    border-start-end-radius: 0px;
    border-start-start-radius: 0px;
}
/* /Components/Blocks/VolunteerEntryBlock.razor.rz.scp.css */
/* Ensure accessible-room check icon is green across themes.
   Uses Bootstrap CSS variable when present, falls back to a safe green. */
.accessible-yes[b-5el747jzcc] {
    color: #198754 !important;
    -webkit-text-fill-color: #198754 !important;
}

.bg-success[b-5el747jzcc] {
    background-color: #198754 !important;

}

.text-only .bg-success[b-5el747jzcc] {
    background-color: var(--text-body) !important;
    -webkit-text-fill-color: var(--text-body) !important;
}

.text-only .accessible-yes[b-5el747jzcc] {
    color: var(--text-body) !important;
    -webkit-text-fill-color: var(--text-body) !important;
}

.text-only .text-danger[b-5el747jzcc] {
    color: var(--text-body) !important;
    -webkit-text-fill-color: var(--text-body) !important;
}
/* /Components/BodyBlocks/TableBlock.razor.rz.scp.css */
.table-dark[b-tchymovt2o] {
    font-family: 'Ysabeau Office', 'Ysabeau', sans-serif;
    color: var(--theme-dark-accent);
}

    .table-dark th[b-tchymovt2o] {
        font-family: 'Ysabeau Office', 'Ysabeau', sans-serif;
        color: var(--theme-dark-accent);
    }

[data-bs-theme=light] .table-dark th[b-tchymovt2o] {
    background-color: var(--theme-dark-menu-bg);

}

[data-bs-theme=light] th.table-dark[b-tchymovt2o] {
    background-color: var(--theme-dark-menu-bg);
}


[data-bs-theme=light] th.table-dark[b-tchymovt2o] {
    background-color: var(--theme-dark-menu-bg)!important;
}

[data-bs-theme=light] .table-striped > tbody > tr:nth-of-type(odd) > th.table-dark[b-tchymovt2o] {
    --bs-table-bg-type: var(--theme-dark-menu-bg) !important;
}
[data-bs-theme=light] .table-striped > tbody > tr:nth-of-type(even) > th.table-dark[b-tchymovt2o] {
    --bs-table-bg-type: var(--theme-dark-menu-bg) !important;
}

.text-only .table-dark[b-tchymovt2o] {
    color: var(--bs-body-color)
}

    .text-only .table-dark th[b-tchymovt2o] {
        color: var(--bs-body-color)
    }


.text-only .table-dark th[b-tchymovt2o] {
    background-color: var(--bs-body-bg);
}

.text-only th.table-dark[b-tchymovt2o] {
    background-color: var(--bs-body-bg);
}


.text-only th.table-dark[b-tchymovt2o] {
    background-color: var(--bs-body-bg) !important;
}

.text-only .table-striped > tbody > tr:nth-of-type(odd) > th.table-dark[b-tchymovt2o] {
    --bs-table-bg-type: var(--bs-body-bg) !important;
}

.text-only .table-striped > tbody > tr:nth-of-type(even) > th.table-dark[b-tchymovt2o] {
    --bs-table-bg-type: var(--bs-body-bg) !important;
}

.text-only th[b-tchymovt2o],
.text-only tr[b-tchymovt2o],
.text-only td[b-tchymovt2o] {
    font-family: 'Ysabeau', sans-serif;
    color: var(--bs-body-color);
}
/* /Components/Dialogs/IconKeyDialog.razor.rz.scp.css */
.bi[b-dw9x2i6qqj] {
  font-size: 1.5rem;
}

.badge-18[b-dw9x2i6qqj] {
  display: inline-block;
  padding: .25rem .4rem;
  font-weight: 700;
  border-radius: .25rem;
  background: var(--theme-danger);
  color: var(--theme-dark-text);
}

/* Ensure icons are contained within a fixed-size box and centered */
.icon-key .ik-box[b-dw9x2i6qqj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    min-width: 1.75rem;
    border-radius: .5rem;
    line-height: 1;
    overflow: hidden;
    flex: 0 0 auto;
}

/* Normalize icon sizing within the box */
.icon-key .ik-box > i[b-dw9x2i6qqj] {
    font-size: 1rem;
    line-height: 1;
}

.text-only .modal-header[b-dw9x2i6qqj],
.text-only .modal-body[b-dw9x2i6qqj],
.text-only .modal-footer[b-dw9x2i6qqj] {
    border-top-color: var(--bs-border-color);
}
/* /Components/Dialogs/ProgrammeEventDialog.razor.rz.scp.css */
.programme-event-dialog .ped-content[b-agu1tq6eml] {
    border: 1px solid var(--ped-header-bg) !important;
    /* shadow via ShadowClass */
}

.programme-event-dialog .ped-header[b-agu1tq6eml] {
    background: var(--ped-header-bg) !important;
    color: var(--ped-header-fg) !important;
    border-bottom: 0;
    display: flex;             /* ensure flex layout */
    align-items: center;
    margin: 0 !important;
}

/* Close button inherits the header foreground color exactly */
.programme-event-dialog .ped-header .ped-close[b-agu1tq6eml] {
    background: transparent;
    border: 0;
    color: var(--ped-header-fg);
    padding: .25rem;
    line-height: 1;
}
.programme-event-dialog .ped-header .ped-close .bi[b-agu1tq6eml] {
    font-size: 1.1rem;
}
.programme-event-dialog .ped-header .ped-close:hover[b-agu1tq6eml] {
    opacity: .85;
}
.programme-event-dialog .ped-header .ped-close:focus[b-agu1tq6eml] {
    outline: 2px solid color-mix(in srgb, var(--ped-header-fg) 50%, transparent);
    outline-offset: 2px;
}

/* push the close button to the far right */
.programme-event-dialog .ped-header > .btn[b-agu1tq6eml],
.programme-event-dialog .ped-header > .btn-close[b-agu1tq6eml],
.programme-event-dialog .ped-header > .ped-close[b-agu1tq6eml] {
    margin-left: auto;         /* right-align in flex */
}

.programme-event-dialog .ped-body[b-agu1tq6eml] {
    padding-top: .75rem;
    padding-bottom: .75rem;
}

.programme-event-dialog .ped-footer[b-agu1tq6eml] {
    border-top: 0;
}

.programme-event-dialog .ped-chip[b-agu1tq6eml] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .9rem;
    line-height: 1.2;
    padding: .2rem .5rem;
    border-radius: 999px;
    background-color: var(--bs-tertiary-bg);
    color: var(--bs-emphasis-color);
    border: 1px solid var(--bs-border-color);
}

.programme-event-dialog .ped-18[b-agu1tq6eml] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .75rem;
    line-height: 1;
    padding: .05rem .3rem;
    border-radius: 999px;
    border: 1px solid currentColor;
}

/* Animations: dialog */
.ped-dialog[b-agu1tq6eml] {
    will-change: transform, opacity;
}
.ped-dialog.ped-zoom-in[b-agu1tq6eml] {
    animation: ped-zoom-in-b-agu1tq6eml var(--ped-open-duration) ease-out both;
}
.ped-dialog.ped-zoom-out[b-agu1tq6eml] {
    animation: ped-zoom-out-b-agu1tq6eml var(--ped-close-duration) ease-in both;
}
.ped-dialog.ped-slide-up-in[b-agu1tq6eml] {
    animation: ped-slide-up-in-b-agu1tq6eml var(--ped-open-duration) ease-out both;
}
.ped-dialog.ped-slide-down-out[b-agu1tq6eml] {
    animation: ped-slide-down-out-b-agu1tq6eml var(--ped-close-duration) ease-in both;
}

/* Animations: backdrop */
.ped-backdrop[b-agu1tq6eml] {
    /* remove Bootstrap�s built-in fade timing; we control opacity */
    opacity: 1;
}
.ped-backdrop.ped-fade-in[b-agu1tq6eml] {
    animation: ped-fade-in-b-agu1tq6eml var(--ped-open-duration) linear both;
}
.ped-backdrop.ped-fade-out[b-agu1tq6eml] {
    animation: ped-fade-out-b-agu1tq6eml var(--ped-close-duration) linear both;
}

/* Keyframes */
@keyframes ped-zoom-in-b-agu1tq6eml {
    from { opacity: 0; transform: scale(.96) translateY(8px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes ped-zoom-out-b-agu1tq6eml {
    from { opacity: 1; transform: scale(1) translateY(0); }
    to   { opacity: 0; transform: scale(.98) translateY(8px); }
}
@keyframes ped-slide-up-in-b-agu1tq6eml {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes ped-slide-down-out-b-agu1tq6eml {
    from { opacity: 1; transform: translateY(0); }
    to   { opacity: 0; transform: translateY(16px); }
}
@keyframes ped-fade-in-b-agu1tq6eml {
    from { opacity: 0; }
    to   { opacity: .5; }
}
@keyframes ped-fade-out-b-agu1tq6eml {
    from { opacity: .5; }
    to   { opacity: 0; }
}

.programme-event-dialog .ped-description[b-agu1tq6eml] {
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
    color: var(--bs-emphasis-color);
}
.programme-event-dialog .ped-description p[b-agu1tq6eml] { margin: 0 0 .5rem 0; }
.programme-event-dialog .ped-description ul[b-agu1tq6eml],
.programme-event-dialog .ped-description ol[b-agu1tq6eml] { margin: 0 0 .5rem 1.25rem; padding-left: 1.25rem; }
.programme-event-dialog .ped-description a[b-agu1tq6eml] { color: var(--bs-emphasis-color); text-decoration: underline; }
.programme-event-dialog .ped-content.ped-hidden[b-agu1tq6eml] {
  position: relative;
}

/* Diagonal stripe overlay for hidden events (dialog) */
.programme-event-dialog .ped-content.ped-hidden[b-agu1tq6eml]::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  /* subtle dark stripes over any background color */
  background: repeating-linear-gradient(
    45deg,
    rgba(0, 0, 0, 0.15) 0px,
    rgba(0, 0, 0, 0.15) 8px,
    rgba(0, 0, 0, 0.0) 8px,
    rgba(0, 0, 0, 0.0) 16px
  );
}


/* Traffic-light indicators for volunteer status used in dialog */
.vol-light[b-agu1tq6eml] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
   border: 1px solid rgba(0,0,0,0.08);
}

.vol-green[b-agu1tq6eml] {
    background: #198754;
    box-shadow: 0 0 0 4px rgba(25,135,84,0.06);
}

.vol-amber[b-agu1tq6eml] {
    background: #ffc107;
    box-shadow: 0 0 0 4px rgba(255,193,7,0.06);
}

.vol-red[b-agu1tq6eml] {
    background: #dc3545;
    box-shadow: 0 0 0 4px rgba(220,53,69,0.06);
}

/* Dialog volunteer section spacing */
.ped-volunteers[b-agu1tq6eml] {
    border-top: 1px dashed var(--bs-border-color);
    padding-top: .75rem;
    margin-top: .75rem;
}



.text-only .programme-event-dialog .ped-header[b-agu1tq6eml],
.text-only .programme-event-dialog .ped-header *[b-agu1tq6eml] {
    background: var(--bs-bg-primary) !important;
    color: var(--bs-emphasis-color) !important;
    border-bottom: 1px solid var(--bs-border-color) !important;
    box-shadow: none !important;
}
.text-only .programme-event-dialog .ped-header .ped-close[b-agu1tq6eml],
.text-only .programme-event-dialog .ped-header .ped-close .bi[b-agu1tq6eml] {
    color: var(--bs-emphasis-color) !important;
}

.text-only .programme-event-dialog .ped-content[b-agu1tq6eml] {
    border: 1px solid var(--bs-border-color) !important;
    background: var(--bs-bg-primary) !important;
    color: var(--bs-emphasis-color);
}

.text-only .programme-event-dialog .ped-body[b-agu1tq6eml] {
    background: var(--bs-bg-primary) !important;
    color: var(--bs-emphasis-color);
}

.text-only .programme-event-dialog .ped-chip[b-agu1tq6eml] {
    background-color: var(--bs-secondary-bg) !important;
    color: var(--bs-emphasis-color) !important;
    border: 1px solid var(--bs-border-color) !important;
}

.text-only .btn[b-agu1tq6eml] {
    background: var(--bs-body-color) !important;
    color: var(--bs-body-bg) !important;
    border: 1px solid var(--bs-border-color) !important;
}

.text-only .alert[b-agu1tq6eml] {
    background: var(--bs-bg-primary) !important;
    color: var(--bs-emphasis-color) !important;
    border: 1px solid var(--bs-border-color) !important;
}

.text-only .table-secondary th[b-agu1tq6eml] {
    background: var(--bs-bg-primary) !important;
    color: var(--bs-emphasis-color) !important;
    text-decoration: underline !important;
    border-bottom: 1px solid var(--bs-border-color) !important;
}
/* /Components/Dialogs/RoomDetailsDialog.razor.rz.scp.css */
.room-details-dialog .ped-content[b-j2c2mxmnd4] {
    border: 1px solid var(--ped-header-bg) !important;
    /* shadow via ShadowClass */
}

.room-details-dialog .ped-header[b-j2c2mxmnd4] {
    background: var(--ped-header-bg) !important;
    color: var(--ped-header-fg) !important;
    border-bottom: 0;
    display: flex; /* ensure flex layout */
    align-items: center;
    margin: 0 !important;
}

    /* Close button inherits the header foreground color exactly */
    .room-details-dialog .ped-header .ped-close[b-j2c2mxmnd4] {
        background: transparent;
        border: 0;
        color: var(--ped-header-fg);
        padding: .25rem;
        line-height: 1;
    }

        .room-details-dialog .ped-header .ped-close .bi[b-j2c2mxmnd4] {
            font-size: 1.1rem;
        }

        .room-details-dialog .ped-header .ped-close:hover[b-j2c2mxmnd4] {
            opacity: .85;
        }

        .room-details-dialog .ped-header .ped-close:focus[b-j2c2mxmnd4] {
            outline: 2px solid color-mix(in srgb, var(--ped-header-fg) 50%, transparent);
            outline-offset: 2px;
        }

    /* push the close button to the far right */
    .room-details-dialog .ped-header > .btn[b-j2c2mxmnd4],
    .room-details-dialog .ped-header > .btn-close[b-j2c2mxmnd4],
    .room-details-dialog .ped-header > .ped-close[b-j2c2mxmnd4] {
        margin-left: auto; /* right-align in flex */
    }

.room-details-dialog .ped-body[b-j2c2mxmnd4] {
    padding-top: .75rem;
    padding-bottom: .75rem;
}

.room-details-dialog .ped-footer[b-j2c2mxmnd4] {
    border-top: 0;
}

.room-details-dialog .ped-chip[b-j2c2mxmnd4] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .9rem;
    line-height: 1.2;
    padding: .2rem .5rem;
    border-radius: 999px;
    background-color: var(--bs-tertiary-bg);
    color: var(--bs-emphasis-color);
    border: 1px solid var(--bs-border-color);
}

.room-details-dialog .ped-18[b-j2c2mxmnd4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .75rem;
    line-height: 1;
    padding: .05rem .3rem;
    border-radius: 999px;
    border: 1px solid currentColor;
}

/* Animations: dialog */
.ped-dialog[b-j2c2mxmnd4] {
    will-change: transform, opacity;
}

    .ped-dialog.ped-zoom-in[b-j2c2mxmnd4] {
        animation: ped-zoom-in-b-j2c2mxmnd4 var(--ped-open-duration) ease-out both;
    }

    .ped-dialog.ped-zoom-out[b-j2c2mxmnd4] {
        animation: ped-zoom-out-b-j2c2mxmnd4 var(--ped-close-duration) ease-in both;
    }

    .ped-dialog.ped-slide-up-in[b-j2c2mxmnd4] {
        animation: ped-slide-up-in-b-j2c2mxmnd4 var(--ped-open-duration) ease-out both;
    }

    .ped-dialog.ped-slide-down-out[b-j2c2mxmnd4] {
        animation: ped-slide-down-out-b-j2c2mxmnd4 var(--ped-close-duration) ease-in both;
    }

/* Animations: backdrop */
.ped-backdrop[b-j2c2mxmnd4] {
    /* remove Bootstrap�s built-in fade timing; we control opacity */
    opacity: 1;
}

    .ped-backdrop.ped-fade-in[b-j2c2mxmnd4] {
        animation: ped-fade-in-b-j2c2mxmnd4 var(--ped-open-duration) linear both;
    }

    .ped-backdrop.ped-fade-out[b-j2c2mxmnd4] {
        animation: ped-fade-out-b-j2c2mxmnd4 var(--ped-close-duration) linear both;
    }

/* Keyframes */
@keyframes ped-zoom-in-b-j2c2mxmnd4 {
    from {
        opacity: 0;
        transform: scale(.96) translateY(8px);
    }

    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

@keyframes ped-zoom-out-b-j2c2mxmnd4 {
    from {
        opacity: 1;
        transform: scale(1) translateY(0);
    }

    to {
        opacity: 0;
        transform: scale(.98) translateY(8px);
    }
}

@keyframes ped-slide-up-in-b-j2c2mxmnd4 {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes ped-slide-down-out-b-j2c2mxmnd4 {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(16px);
    }
}

@keyframes ped-fade-in-b-j2c2mxmnd4 {
    from {
        opacity: 0;
    }

    to {
        opacity: .5;
    }
}

@keyframes ped-fade-out-b-j2c2mxmnd4 {
    from {
        opacity: .5;
    }

    to {
        opacity: 0;
    }
}

.room-details-dialog .ped-description[b-j2c2mxmnd4] {
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
    color: var(--bs-emphasis-color);
}

    .room-details-dialog .ped-description p[b-j2c2mxmnd4] {
        margin: 0 0 .5rem 0;
    }

    .room-details-dialog .ped-description ul[b-j2c2mxmnd4],
    .room-details-dialog .ped-description ol[b-j2c2mxmnd4] {
        margin: 0 0 .5rem 1.25rem;
        padding-left: 1.25rem;
    }

    .room-details-dialog .ped-description a[b-j2c2mxmnd4] {
        color: var(--bs-emphasis-color);
        text-decoration: underline;
    }

.room-details-dialog .ped-content.ped-hidden[b-j2c2mxmnd4] {
    position: relative;
}

    /* Diagonal stripe overlay for hidden events (dialog) */
    .room-details-dialog .ped-content.ped-hidden[b-j2c2mxmnd4]::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        border-radius: inherit;
        /* subtle dark stripes over any background color */
        background: repeating-linear-gradient( 45deg, rgba(0, 0, 0, 0.15) 0px, rgba(0, 0, 0, 0.15) 8px, rgba(0, 0, 0, 0.0) 8px, rgba(0, 0, 0, 0.0) 16px );
    }
/* /Components/Forms/AddressForm.razor.rz.scp.css */
/* /Components/Forms/HotelWaitingListForm.razor.rz.scp.css */
[b-uqhf96b20j].helptext p {
    margin-bottom: 0 !important;
}

/* /Components/Forms/HotelWaitingListWizard.razor.rz.scp.css */
/* Ensure guest notes wrap inside the review panel, preserve newlines and break long words */
.guest-notes[b-c0pvtbkk6f] {
  white-space: pre-wrap;       /* preserve user line breaks and wrap */
  overflow-wrap: anywhere;     /* allow breaking within long words if needed */
  word-break: break-word;      /* fallback for some browsers */
  hyphens: auto;               /* allow hyphenation where supported */
  max-width: 100%;
  word-wrap: break-word;
}

[b-c0pvtbkk6f].helptext p {
    margin-bottom: 0 !important;
}
/* /Components/Forms/MaskeradeParticipantForm.razor.rz.scp.css */
.text-only .nav-link.active[b-sviedp2jii] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    border-bottom: none;
    color: rgba(var(--bs-body-bg-rgb),1) !important;
}

.text-only .nav-link:hover[b-sviedp2jii] {
    color: rgba(var(--bs-body-color-rgb),1) !important;
}

.text-only .nav-link.active:hover[b-sviedp2jii] {
    color: rgba(var(--bs-body-bg-rgb),1) !important;
}
/* /Components/HomePageBlocks/QuoteBlock.razor.rz.scp.css */
.text-only .outer-border[b-ccsc9ebck7],
.text-only .mid-border[b-ccsc9ebck7],
.text-only .inner-border[b-ccsc9ebck7],
.text-only .corner-decoration[b-ccsc9ebck7],
.text-only .vertical-decoration[b-ccsc9ebck7] {
    display: none;
}

blockquote.ma-quote-card[b-ccsc9ebck7] {
    min-height: 280px;
    border: 1px solid var(--theme-light-border, rgba(0,0,0,0.12));
    background: var(--theme-light-card-bg, #fbf7ee);
    color: var(--theme-light-text, #1f1f1f);
    border-radius: 1rem;
    overflow: hidden;
    position: relative;
    box-shadow: 0 10px 24px rgba(0,0,0,0.16);
    transition: border-color 220ms ease, box-shadow 220ms ease, background 220ms ease, color 220ms ease;
}

blockquote.ma-quote-card[b-ccsc9ebck7]::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(135deg, rgba(255,231,160,0.10), rgba(74, 52, 36, 0) 40%, rgba(255,255,255,0) 100%);
    mix-blend-mode: soft-light;
}

[data-bs-theme=dark] blockquote.ma-quote-card[b-ccsc9ebck7] {
    border-color: var(--theme-dark-border, rgba(255,255,255,0.18));
    background: var(--theme-dark-card-bg, #1a2030);
    color: var(--theme-dark-text, #f1f5f9);
    box-shadow: 0 10px 24px rgba(0,0,0,0.45);
}

blockquote.ma-quote-card .position-relative[b-ccsc9ebck7] {
    margin: 2.4rem !important;
}

blockquote.ma-quote-card .position-relative[b-ccsc9ebck7]  .quote-body {
    padding: 1.35rem !important;
    margin-left: 2.8rem !important;
    margin-right: 2.8rem !important;
    font-size: 1.2em;
}

blockquote.ma-quote-card .position-relative[b-ccsc9ebck7]  .quote-body p {
    margin-bottom: 0.85em;
}

.ma-flight-strip[b-ccsc9ebck7] {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    background: linear-gradient(90deg, #003087 0%, #0056b3 60%, #ffc72c 100%);
    color: white;
    font-family: 'Share Tech Mono', monospace;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border-bottom: 1px solid rgba(255, 255, 255, 0.22);
    overflow: hidden;
}

.ma-flight-strip[b-ccsc9ebck7]::before {
    content: "";
    position: absolute;
    bottom: 0px;
    left: -35%;
    width: 18%;
    height: 2px;
    background: rgba(255,255,255,0.35);
    border-radius: 2px;
    transform: translateY(0);
    animation: taxi-line-b-ccsc9ebck7 4.0s linear infinite;
    box-shadow: 0 0 5px rgba(255,255,255,0.35);
}

@keyframes taxi-line-b-ccsc9ebck7 {
    from { left: -35%; opacity: 0.0; }
    20% { opacity: 0.4; }
    80% { opacity: 0.4; }
    to { left: 120%; opacity: 0.0; }
}

.ma-flight-strip .ma-flight-code[b-ccsc9ebck7] {
    font-weight: 700;
}

.ma-flight-strip .ma-flight-route[b-ccsc9ebck7] {
    flex: 1;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ma-flight-strip .ma-flight-gate[b-ccsc9ebck7] {
    background: rgba(255,255,255,0.2);
    border: 1px solid rgba(255,255,255,0.35);
    border-radius: 4px;
    padding: 0.1rem 0.45rem;
}

.text-only blockquote.ma-quote-card .ma-flight-strip[b-ccsc9ebck7] {
    display: none !important;
}

.text-only blockquote.ma-quote-card .position-relative[b-ccsc9ebck7] {
    margin: 1.4rem !important;
}

blockquote.ma-quote-card[b-ccsc9ebck7]::after {
    content: "✈";
    position: absolute;
    top: 1rem;
    right: 1rem;
    font-size: 1.5rem;
    color: rgba(255,255,255,0.45);
    opacity: 0.85;
    transform: rotate(15deg);
}

[data-bs-theme=dark] .ma-flight-strip[b-ccsc9ebck7] {
    background: linear-gradient(90deg, #121b38 0%, #0d2554 60%, #8c6f0a 100%);
}

[data-bs-theme=dark] .ma-flight-strip .ma-flight-gate[b-ccsc9ebck7] {
    background: rgba(255,255,255,0.12);
    border-color: rgba(255,255,255,0.2);
}
blockquote.ma-quote-card .open-quote[b-ccsc9ebck7]::before,
blockquote.ma-quote-card .close-quote[b-ccsc9ebck7]::before {
    color: var(--theme-light-text-emphasis, rgba(39, 39, 39, 0.25));
}

[data-bs-theme=dark] blockquote.ma-quote-card .open-quote[b-ccsc9ebck7]::before,
[data-bs-theme=dark] blockquote.ma-quote-card .close-quote[b-ccsc9ebck7]::before {
    color: var(--theme-dark-text-emphasis, rgba(255, 255, 255, 0.25));
}



    blockquote .position-relative[b-ccsc9ebck7]  .quote-body p {
        margin-bottom:0em;
    }

blockquote .open-quote[b-ccsc9ebck7]::before {
    content: open-quote;
    color: var(--bs-secondary-text-emphasis);
    font-size: 4em;
}

blockquote .open-quote[b-ccsc9ebck7] {
    line-height: 4em;
}


blockquote .close-quote[b-ccsc9ebck7]::before {
    content: close-quote;
    font-size: 4em;
    color: var(--bs-secondary-text-emphasis);
}

blockquote cite[b-ccsc9ebck7] {
    font-size: 1.25em !important;
    margin-bottom: 4em !important;
    margin-right: 3em !important;
    margin-left: 5.5em !important;
}

@media (max-width: 768px) {
    .corner-decoration[b-ccsc9ebck7] {
        width: 2em;
        height: 2em;
    }

    .vertical-decoration[b-ccsc9ebck7] {
        width: 6em;
        height: 2em;
    }

    blockquote .position-relative[b-ccsc9ebck7] {
        margin: 2em 1.5em 1.5em !important;
    }

        blockquote .position-relative div[b-ccsc9ebck7] {
            margin-left: 0.5em !important;
            margin-right: 0.5em !important;
            padding:0 !important;
        }


    blockquote .open-quote[b-ccsc9ebck7]::before {
        content: open-quote;
        color: var(--bs-secondary-text-emphasis);
        font-size: 3em;
    }

    blockquote .open-quote[b-ccsc9ebck7] {
        line-height: 3em;
    }


    blockquote .close-quote[b-ccsc9ebck7]::before {
        content: close-quote;
        font-size: 3em;
        color: var(--bs-secondary-text-emphasis);
    }

    blockquote .close-quote[b-ccsc9ebck7] {
        line-height: 3em;
    }

    blockquote cite[b-ccsc9ebck7] {
        margin-left: 5.2em !important;
        font-size: 1em !important;
    }

    blockquote .position-relative[b-ccsc9ebck7]  .quote-body {
        font-size: 1em;
    }

}


/* /Components/HomePageBlocks/StepsBlock.razor.rz.scp.css */
.card .card-title[b-kno5p1a6mx] {
    font-weight: bold;
    color: var(--theme-dark-accent);
    padding-bottom: 1em;
}

.text-only .card .card-title[b-kno5p1a6mx] {
    color: var(--bs-body-color);
}

[data-bs-theme=light] .card .card-title[b-kno5p1a6mx] {
    color: var(--theme-light-text);
}

.card .card-footer[b-kno5p1a6mx] {
    padding: var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);
}
/* /Components/Navigation/Footer.razor.rz.scp.css */
/* =================================================================
   MOIST AIR — Footer
   Steampunk airline departures board aesthetic.
   Theatre stage/curtain assets above are preserved unchanged.
   ================================================================= */

/* ── Outer footer shell ── */
.ma-footer[b-3jm9jr4oqc] {
    position: relative;
    overflow: hidden;
    background: var(--board-bg);
    border-top: 3px solid var(--board-frame);
}

/* ── Main body block ── */
.ma-footer-body[b-3jm9jr4oqc] {
    position: relative;
    z-index: 5;
    background: transparent;
    padding: 0 0 8px;
}

/* ── Brass top rule ── */
.ma-footer-rule[b-3jm9jr4oqc] {
    height: 2px;
    background: linear-gradient(90deg,
        transparent 0%,
        var(--board-frame) 15%,
        var(--theme-dark-accent) 50%,
        var(--board-frame) 85%,
        transparent 100%);
    margin: 0 40px 10px;
    opacity: 0.7;
}

/* ── Logo row ── */
.ma-footer-logo-row[b-3jm9jr4oqc] {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 6px 16px 2px;
}

.ma-footer-logo[b-3jm9jr4oqc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* ── SVG logo — amber on dark ── */
.ma-footer-svg[b-3jm9jr4oqc] {
    width: 130px;
    height: auto;
    display: block;
    filter: drop-shadow(0 1px 8px rgba(0, 0, 0, 0.95));
}

/* ── Image logo — time-of-day-aware ── */
.ma-footer-logo-img[b-3jm9jr4oqc] {
    width: 130px;
    height: auto;
    display: block;
}

/* Default (night): use the dark-mode asset (light text on dark background) to avoid black-on-black.
   During daytime (.is-daytime) switch to the light asset. */
.ma-footer-logo-img--light[b-3jm9jr4oqc] { display: none; }
.ma-footer-logo-img--dark[b-3jm9jr4oqc]  { display: block; }

/* Daytime: show light asset */
.is-daytime .ma-footer-logo-img--dark[b-3jm9jr4oqc]  { display: none; }
.is-daytime .ma-footer-logo-img--light[b-3jm9jr4oqc] { display: block; }

.ma-footer-tagline[b-3jm9jr4oqc] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 1.1rem;
    letter-spacing: 0.22em;
    color: var(--board-amber);
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    padding: 0.4em 1.2em 0.3em 1.2em;
    margin-top: 0.2em;
    display: inline-block;
  
}

/* ── Footer nav links ── */
.ma-footer-nav[b-3jm9jr4oqc] {
    padding: 16px 24px 8px;
}

.ma-footer-links[b-3jm9jr4oqc] {
    border-top: 1px solid var(--board-frame);
    border-bottom: 1px solid var(--board-frame);
    padding: 10px 0;
}

.ma-footer-link[b-3jm9jr4oqc] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.85rem;
    letter-spacing: 0.1em;
    color: var(--board-amber-dim);
    text-decoration: none;
    text-transform: uppercase;
    padding: 4px 14px;
    border-bottom: none;
    transition: color 120ms ease;
    white-space: nowrap;
}

.ma-footer-link:hover[b-3jm9jr4oqc],
.ma-footer-link:focus-visible[b-3jm9jr4oqc] {
    color: var(--board-amber);
    border-bottom: none;
    outline: none;
}

/* ── Rich-text body copy ── */
.ma-footer-copy[b-3jm9jr4oqc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    padding: 12px 40px 4px;
    text-align: center;
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.875rem;
    letter-spacing: 0.04em;
}

.ma-footer-copy > div[b-3jm9jr4oqc] {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    padding: 0.5rem 1rem;
    background: rgba(10, 6, 2, 0.58);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0.8rem;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.85), 0 0 2px var(--board-amber), 0 0 8px var(--board-amber-dim);

}

    .ma-footer-copy > div > h4[b-3jm9jr4oqc] {
        margin-top: -0.25rem !important;
        color: var(--board-amber) !important;
    }



.ma-footer-copy a[b-3jm9jr4oqc] {
    color: var(--board-amber);
    border-bottom-color: var(--board-amber-dim);
}

.ma-footer-copy a:hover[b-3jm9jr4oqc] {
    color: var(--board-amber);
}

/* ── Social media icons ── */
.ma-footer-socials[b-3jm9jr4oqc] {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 12px 24px 8px;
}

.ma-footer-social-link[b-3jm9jr4oqc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 2px;
    border: 1px solid var(--board-frame);
    background: var(--board-flap);
    border-bottom: none;
    transition: border-color 120ms ease, background 120ms ease;
}

.ma-footer-social-link:hover[b-3jm9jr4oqc],
.ma-footer-social-link:focus-visible[b-3jm9jr4oqc] {
    border-color: var(--board-amber-dim);
    background: var(--theme-dark-page-bg);
    outline: none;
}

.ma-footer-social-img[b-3jm9jr4oqc] {
    filter: sepia(1) saturate(2) hue-rotate(5deg) brightness(1.1);
    opacity: 0.8;
    transition: opacity 120ms ease;
}

.ma-footer-social-link:hover .ma-footer-social-img[b-3jm9jr4oqc],
.ma-footer-social-link:focus-visible .ma-footer-social-img[b-3jm9jr4oqc] {
    opacity: 1;
}

/* ── Bottom amber status strip ── */
.ma-footer-bottom[b-3jm9jr4oqc] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 10px 24px 6px;
    margin-top: 4px;
}

.ma-footer-bottom-rule[b-3jm9jr4oqc] {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--board-frame));
    max-width: 180px;
}

.ma-footer-bottom-rule:last-child[b-3jm9jr4oqc] {
    background: linear-gradient(90deg, var(--board-frame), transparent);
}

.ma-footer-bottom-amber[b-3jm9jr4oqc] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.65rem;
    letter-spacing: 0.14em;
    color: var(--board-amber);
    text-transform: uppercase;
    white-space: nowrap;
}

@media (max-width: 991px) {
    .ma-footer-bottom-amber[b-3jm9jr4oqc] {
        white-space: normal;
        text-align: center;
    }
}


/* =================================================================
   LIGHT MODE OVERRIDES
   Footer always uses dark/board styling regardless of page theme.
   Sky animation colours (.sky-day etc.) are intentionally preserved.
   ================================================================= */
[data-bs-theme=light] .ma-footer[b-3jm9jr4oqc] {
    background: var(--board-bg);
    border-top-color: var(--board-frame);
}

[data-bs-theme=light] .ma-footer-body[b-3jm9jr4oqc] {
    background: transparent;
}

[data-bs-theme=light] .ma-footer-rule[b-3jm9jr4oqc] {
    background: linear-gradient(90deg,
        transparent 0%,
        var(--board-frame) 15%,
        var(--theme-dark-accent) 50%,
        var(--board-frame) 85%,
        transparent 100%);
    opacity: 0.7;
}

[data-bs-theme=light] .ma-footer-links[b-3jm9jr4oqc] {
    border-color: var(--board-frame);
}

[data-bs-theme=light] .ma-footer-link[b-3jm9jr4oqc] {
    color: var(--board-amber-dim);
}

[data-bs-theme=light] .ma-footer-link:hover[b-3jm9jr4oqc],
[data-bs-theme=light] .ma-footer-link:focus-visible[b-3jm9jr4oqc] {
    color: var(--board-amber);
}

[data-bs-theme=light] .ma-footer-copy[b-3jm9jr4oqc] {
    color: var(--board-amber);
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.85), 0 0 2px var(--board-amber), 0 0 8px var(--board-amber-dim);
}

[data-bs-theme=light] .ma-footer-copy a[b-3jm9jr4oqc] {
    color: var(--board-amber);
    border-bottom-color: var(--board-amber-dim);
}

[data-bs-theme=light] .ma-footer-copy > div[b-3jm9jr4oqc] {
    background: rgba(10, 6, 2, 0.58);
    border-color: rgba(255, 255, 255, 0.08);
}

[data-bs-theme=light] .ma-footer-tagline[b-3jm9jr4oqc] {
    color: var(--board-amber);
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.85), 0 0 2px var(--board-amber), 0 0 8px var(--board-amber-dim);
}

[data-bs-theme=light] .ma-footer-social-link[b-3jm9jr4oqc] {
    border-color: var(--board-frame);
    background: var(--board-flap);
}

[data-bs-theme=light] .ma-footer-social-link:hover[b-3jm9jr4oqc],
[data-bs-theme=light] .ma-footer-social-link:focus-visible[b-3jm9jr4oqc] {
    background: var(--theme-dark-page-bg);
    border-color: var(--board-amber-dim);
}

[data-bs-theme=light] .ma-footer-social-img[b-3jm9jr4oqc] {
    filter: sepia(1) saturate(2) hue-rotate(5deg) brightness(1.1);
    opacity: 0.8;
}

[data-bs-theme=light] .ma-footer-bottom-rule[b-3jm9jr4oqc] {
    background: linear-gradient(90deg, transparent, var(--board-frame));
}

[data-bs-theme=light] .ma-footer-bottom-rule:last-child[b-3jm9jr4oqc] {
    background: linear-gradient(90deg, var(--board-frame), transparent);
}

[data-bs-theme=light] .ma-footer-bottom-amber[b-3jm9jr4oqc] {
    color: var(--board-amber);
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.85), 0 0 2px var(--board-amber), 0 0 8px var(--board-amber-dim);
}

[data-bs-theme=light] .logo_4[b-3jm9jr4oqc] {
    fill: var(--board-amber);
}

[data-bs-theme=light] .logo_8[b-3jm9jr4oqc] {
    fill: var(--board-amber-dim);
}



/* =================================================================
   SKY ANIMATION (DIRIGIBLE & TIME OF DAY)
   ================================================================= */
.ma-footer-sky[b-3jm9jr4oqc] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    transition: background-color 1.5s ease;
    z-index: 0;
}

/* Green ground/grass tint over the countryside strip */
.ma-footer-sky[b-3jm9jr4oqc]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 15%;
    background: transparent;
    z-index: 3;
    pointer-events: none;
    mix-blend-mode: screen;
    opacity: 0;
    transition: opacity 1.5s ease, background 1.5s ease;
}
.ma-footer-sky.sky-night[b-3jm9jr4oqc]::after,
.ma-footer-sky.sky-dawn[b-3jm9jr4oqc]::after {
    opacity: 0;
}
.ma-footer-sky.sky-dusk[b-3jm9jr4oqc]::after {
    opacity: 0.25;
    background: linear-gradient(to top,
        rgba(80, 38, 8, 0.4) 0%,
        rgba(90, 55, 10, 0.18) 38%,
        transparent 100%);
}

.ma-sky-controls[b-3jm9jr4oqc] {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 11;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 6px 8px;
    background: rgba(10, 6, 2, 0.88);
    border: 1px solid var(--board-frame);
    border-radius: 6px;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.ma-ctrl-btn[b-3jm9jr4oqc] {
    background: transparent;
    border: 1px solid var(--board-frame);
    color: var(--board-amber);
    border-radius: 4px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    transition: background 120ms, color 120ms;
    font-size: 0.75rem;
}
.ma-ctrl-btn:hover[b-3jm9jr4oqc] {
    background: var(--board-frame);
    color: var(--board-amber);
}

.ma-ctrl-time[b-3jm9jr4oqc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.ma-ctrl-label[b-3jm9jr4oqc] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.6rem;
    color: var(--board-amber);
    line-height: 1;
}

.ma-time-slider[b-3jm9jr4oqc] {
    width: 60px;
    accent-color: var(--board-amber);
}

.ma-ctrl-weather[b-3jm9jr4oqc] {
    border-top: 1px solid var(--board-frame);
    padding-top: 5px;
    width: 100%;
}

/* The current-weather icon button */
.ma-ctrl-weather-btn[b-3jm9jr4oqc] {
    background: transparent;
    border: 1px solid var(--board-frame);
    color: var(--board-amber);
    border-radius: 4px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    font-size: 1rem;
    transition: background 120ms, border-color 120ms;
    margin: 0 auto;
}

.ma-ctrl-weather-btn:hover[b-3jm9jr4oqc],
.ma-sky-controls.is-open .ma-ctrl-weather-btn[b-3jm9jr4oqc] {
    background: var(--board-frame);
    border-color: var(--board-amber-dim);
}

/* Horizontal icon strip — slides out to the right of the controls panel */
.ma-weather-strip[b-3jm9jr4oqc] {
    position: absolute;
    left: calc(100% + 6px);
    top: 0;
    display: flex;
    flex-direction: row;
    gap: 3px;
    background: rgba(10, 6, 2, 0.92);
    border: 1px solid var(--board-frame);
    border-radius: 6px;
    padding: 4px;
    z-index: 9999;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    box-shadow: 0 4px 20px rgba(0,0,0,0.6);
    /* Slide-in animation */
    transform-origin: left center;
    transform: scaleX(0);
    opacity: 0;
    pointer-events: none;
    transition: transform 160ms cubic-bezier(0.4,0,0.2,1), opacity 120ms ease;
}

.ma-sky-controls.is-open .ma-weather-strip[b-3jm9jr4oqc] {
    transform: scaleX(1);
    opacity: 1;
    pointer-events: auto;
}

/* Individual icon chips */
.ma-weather-chip[b-3jm9jr4oqc] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 4px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    cursor: pointer;
    padding: 0;
    transition: background 100ms, border-color 100ms, transform 80ms;
    line-height: 1;
}

.ma-weather-chip:hover[b-3jm9jr4oqc] {
    background: var(--board-frame);
    border-color: var(--board-amber-dim);
    transform: scale(1.15);
}

.ma-weather-chip.is-active[b-3jm9jr4oqc] {
    background: rgba(255, 180, 50, 0.18);
    border-color: var(--board-amber);
}

.ma-weather-chip-live[b-3jm9jr4oqc] {
    border-bottom: 1px solid var(--board-amber-dim) !important;
    margin-bottom: 2px;
    padding-bottom: 5px;
    height: auto;
    font-size: 0.75rem;
}

/* ── Light-mode overrides for sky controls panel ── */
[data-bs-theme=light] .ma-sky-controls[b-3jm9jr4oqc] {
    background: rgba(250, 242, 220, 0.94);
    border-color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-ctrl-btn[b-3jm9jr4oqc] {
    border-color: var(--theme-light-accent);
    color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-ctrl-btn:hover[b-3jm9jr4oqc] {
    background: var(--theme-light-dropdown-hover-bg);
    color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-ctrl-label[b-3jm9jr4oqc] {
    color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-ctrl-weather[b-3jm9jr4oqc] {
    border-top-color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-ctrl-weather-btn[b-3jm9jr4oqc] {
    border-color: var(--theme-light-accent);
    color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-ctrl-weather-btn:hover[b-3jm9jr4oqc],
[data-bs-theme=light] .ma-sky-controls.is-open .ma-ctrl-weather-btn[b-3jm9jr4oqc] {
    background: var(--theme-light-dropdown-hover-bg);
    border-color: var(--theme-dark-btn-bg);
}

[data-bs-theme=light] .ma-weather-strip[b-3jm9jr4oqc] {
    background: rgba(250, 242, 220, 0.97);
    border-color: var(--theme-light-accent);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.18);
}

[data-bs-theme=light] .ma-weather-chip[b-3jm9jr4oqc] {
    color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-weather-chip:hover[b-3jm9jr4oqc] {
    background: var(--theme-light-dropdown-hover-bg);
    border-color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-weather-chip.is-active[b-3jm9jr4oqc] {
    background: rgba(160, 100, 0, 0.12);
    border-color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-weather-chip-live[b-3jm9jr4oqc] {
    border-bottom-color: var(--theme-light-accent) !important;
}

[data-bs-theme=light] .ma-time-slider[b-3jm9jr4oqc] {
    accent-color: var(--theme-light-accent);
}

/* ── Mobile toggle button — hidden on desktop, shown on small screens ── */
.ma-ctrl-toggle[b-3jm9jr4oqc] {
    display: none;
}

/* ── Mobile: collapse controls to a single icon button ── */
@media (max-width: 575px) {
    /* Keep sky absolutely positioned so content overlays it — same as desktop */
    .ma-footer-sky[b-3jm9jr4oqc] {
        overflow: hidden;
    }

    /* Reserve enough height so the sky scene is visible behind the content */
    .ma-footer[b-3jm9jr4oqc] {
        min-height: 240px;
    }

    /* Body transparent so sky shows through — text-shadow ensures readability */
    .ma-footer-body[b-3jm9jr4oqc] {
        background: transparent;
        z-index: 5;
    }

    [data-bs-theme=light] .ma-footer-body[b-3jm9jr4oqc] {
        background: transparent;
    }

    .ma-ctrl-toggle[b-3jm9jr4oqc] {
        display: flex;
    }

    /* Hide all controls when panel is collapsed (default on mobile) */
    .ma-sky-controls:not(.is-expanded) .ma-ctrl-btn:not(.ma-ctrl-toggle)[b-3jm9jr4oqc],
    .ma-sky-controls:not(.is-expanded) .ma-ctrl-time[b-3jm9jr4oqc],
    .ma-sky-controls:not(.is-expanded) .ma-ctrl-weather[b-3jm9jr4oqc] {
        display: none;
    }

    /* Tighten padding when collapsed */
    .ma-sky-controls:not(.is-expanded)[b-3jm9jr4oqc] {
        padding: 4px;
        gap: 0;
    }

    /* Weather strip drops below the panel on mobile instead of sliding right */
    .ma-weather-strip[b-3jm9jr4oqc] {
        left: 0;
        top: calc(100% + 4px);
        flex-direction: row;
        flex-wrap: wrap;
        max-width: 220px;
        transform-origin: top left;
        transform: scaleY(0);
        transition: transform 160ms cubic-bezier(0.4, 0, 0.2, 1), opacity 120ms ease;
    }

    .ma-sky-controls.is-open .ma-weather-strip[b-3jm9jr4oqc] {
        transform: scaleY(1);
    }
}

.sky-dawn[b-3jm9jr4oqc] { background-color: #cb7264; }
.sky-day[b-3jm9jr4oqc] { background-color: #79addc; }
.sky-dusk[b-3jm9jr4oqc] { background-color: #5b3e6e; }
.sky-night[b-3jm9jr4oqc] { background-color: #0d1321; }

.ma-celestial[b-3jm9jr4oqc] {
    position: absolute;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    transition: left 1.5s ease, top 1.5s ease, background 1.5s ease, box-shadow 1.5s ease;
    z-index: 1;
}

.sky-night .ma-celestial[b-3jm9jr4oqc] {
    background: #fdfdf5;
    box-shadow: 0 0 20px rgba(253,253,245,0.8);
}
.sky-night .ma-moon-phase[b-3jm9jr4oqc] {
    position: absolute;
    top: -1px; left: -1px;
    width: 46px; height: 46px;
    border-radius: 50%;
}

.sky-dawn .ma-celestial[b-3jm9jr4oqc],
.sky-dusk .ma-celestial[b-3jm9jr4oqc] {
    background: #ffb75e;
    box-shadow: 0 0 30px #ffb75e;
}

.sky-day .ma-celestial[b-3jm9jr4oqc] {
    background: #ffe38f;
    box-shadow: 0 0 40px #ffe38f;
}

.sky-day .ma-moon-phase[b-3jm9jr4oqc],
.sky-dawn .ma-moon-phase[b-3jm9jr4oqc],
.sky-dusk .ma-moon-phase[b-3jm9jr4oqc] {
    opacity: 0;
}

.ma-stars[b-3jm9jr4oqc] {
    position: absolute;
    width: calc(100% + 400px);
    height: 100%;
    background-image: 
        radial-gradient(1px 1px at 20px 30px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 80px 70px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(2px 2px at 150px 20px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(1.5px 1.5px at 250px 90px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 320px 40px, #ffffff, rgba(0,0,0,0));
    background-repeat: repeat;
    background-size: 400px 120px;
    opacity: 0;
    transition: opacity 1.5s ease;
    animation: ma-scroll-clouds-b-3jm9jr4oqc 240s linear infinite;
    z-index: 0;
}

.sky-night .ma-stars[b-3jm9jr4oqc] { opacity: 0.8; }
.sky-dusk .ma-stars[b-3jm9jr4oqc] { opacity: 0.3; }

.ma-shooting-stars[b-3jm9jr4oqc] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0; left: 0;
    z-index: 0;
    opacity: 0;
    transition: opacity 1.5s ease;
    pointer-events: none;
}
.sky-night .ma-shooting-stars[b-3jm9jr4oqc] { opacity: 1; }

.ma-star-trail[b-3jm9jr4oqc] {
    position: absolute;
    width: 120px;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
    transform: rotate(-15deg);
    opacity: 0;
    animation: ma-shoot-b-3jm9jr4oqc 8s linear infinite;
}
.ma-star-trail:nth-child(1)[b-3jm9jr4oqc] { top: 20%; left: 80%; animation-delay: 2s; }
.ma-star-trail:nth-child(2)[b-3jm9jr4oqc] { top: 10%; left: 40%; animation-delay: 6s; }
.ma-star-trail:nth-child(3)[b-3jm9jr4oqc] { top: 40%; left: 70%; animation-delay: 11s; }

.ma-skyline[b-3jm9jr4oqc] {
    position: absolute;
    bottom: 0;
    width: calc(100% + 4000px);
    height: 100%;
    min-height: 160px;
    animation: ma-scroll-skyline-b-3jm9jr4oqc 240s linear infinite;
    z-index: 2;
    filter: brightness(1.05) sepia(0.1);
    transition: opacity 1.5s, filter 2s;
    opacity: 1;
}

/* Two img tiles side-by-side fill the scrolling div. Using <img> instead of
   background-image enables SMIL animations (windmill sails, chimney smoke)
   which are blocked by browser sandboxing when SVG is a CSS background. */
.ma-skyline-tile[b-3jm9jr4oqc] {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 4000px;
    height: 100%;
    display: block;
    pointer-events: none;
}

.ma-skyline-tile:nth-child(2)[b-3jm9jr4oqc] {
    left: 4000px;
}

.ma-skyline[b-3jm9jr4oqc]::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: rgba(0, 0, 0, 0);
    transition: background 1.5s ease, opacity 1.5s ease;
}

.ma-hot-air-balloon[b-3jm9jr4oqc] {
    position: absolute;
    left: var(--balloon-left, 6%);
    bottom: 0px;
    width: calc(120px * var(--balloon-scale, 1.0));
    height: calc(218px * var(--balloon-scale, 1.0));
    z-index: 1; /* behind skyline */
    pointer-events: none;
    animation: balloon-rise-b-3jm9jr4oqc 80s linear infinite;
    opacity: 1 !important;
    visibility: visible;
    display: block;
    transform-origin: center bottom;
    border: none;
}

.ma-hot-air-balloon.is-hidden[b-3jm9jr4oqc] {
    opacity: 0 !important;
    visibility: hidden !important;
    animation: none !important;
}

.ma-plane.is-hidden[b-3jm9jr4oqc] {
    opacity: 0 !important;
    visibility: hidden !important;
    animation: none !important;
}

.ma-hot-air-balloon img[b-3jm9jr4oqc] {
    width: 100%;
    height: 100%;
    display: block;
    opacity: 1 !important;
}

@keyframes balloon-rise-b-3jm9jr4oqc {
    0% {
        transform: translateX(-90px) translateY(52px) scale(0.62);
        opacity: 0;
    }
    12% {
        transform: translateX(-84px) translateY(26px) scale(0.66);
        opacity: 0.4;
    }
    20% {
        transform: translateX(-66px) translateY(8px) scale(0.70);
        opacity: 0.8;
    }
    40% {
        transform: translateX(60px) translateY(-150px) scale(0.85);
        opacity: 1;
    }
    70% {
        transform: translateX(210px) translateY(-330px) scale(0.92);
        opacity: 1;
    }
    100% {
        transform: translateX(420px) translateY(-540px) scale(0.95);
        opacity: 0;
    }
}

/* dawn: dim and desaturate — cool early-morning stone */
.sky-dawn  .ma-skyline[b-3jm9jr4oqc] { filter: brightness(0.75) saturate(0.60); }
.sky-dawn  .ma-skyline[b-3jm9jr4oqc]::before { background: rgba(100, 70, 40, 0.10); }
/* day: warm sandstone/brick under clear sky */
.sky-day   .ma-skyline[b-3jm9jr4oqc] { filter: brightness(1.15) sepia(0.28) saturate(1.05); }
.sky-day   .ma-skyline[b-3jm9jr4oqc]::before { background: rgba(255, 220, 170, 0.04); }
/* dusk: golden-amber on stonework, warm orange countryside */
.sky-dusk  .ma-skyline[b-3jm9jr4oqc] { filter: sepia(0.75) brightness(0.88) saturate(1.45) hue-rotate(-8deg); }
.sky-dusk  .ma-skyline[b-3jm9jr4oqc]::before { background: rgba(90, 38, 15, 0.20); }
/* night: near-silhouette — city-lights layer handles window glow */
.sky-night .ma-skyline[b-3jm9jr4oqc] { filter: brightness(0.35) saturate(0.4); }
.sky-night .ma-skyline[b-3jm9jr4oqc]::before { background: rgba(8, 14, 30, 0.25); }

/* ensure windows stay visible and bright at night */
.sky-night .ma-city-lights[b-3jm9jr4oqc] {
    mix-blend-mode: screen;
    filter: brightness(1.6) saturate(1.85);
    opacity: 1;
}

/* ── Night city window lights ── */
/*
   A second SVG layer sharing the same 4000px viewBox as the skyline.
   Contains only amber window rects at exact building positions.
   Countryside region (x=1480..3100) has NO windows — lights only in buildings.
   Scrolls in sync with ma-scroll-skyline at 240s.
*/
.ma-city-lights[b-3jm9jr4oqc] {
    position: absolute;
    bottom: 0;
    width: calc(100% + 4000px);
    height: 100%;
    pointer-events: none;
    z-index: 3;
    opacity: 0;
    transition: opacity 2s ease;
    animation: ma-scroll-skyline-b-3jm9jr4oqc 240s linear infinite;
    background-image: url('/images/footer-skyline-lights.svg');
    background-size: 4000px 220px;
    background-repeat: repeat-x;
    background-position: left bottom;
    mix-blend-mode: screen;
    
}

@keyframes city-flicker-b-3jm9jr4oqc {
    0% { opacity: 0.75; }
    5% { opacity: 0.88; }
    10% { opacity: 0.63; }
    20% { opacity: 0.8; }
    30% { opacity: 0.72; }
    40% { opacity: 0.82; }
    60% { opacity: 0.7; }
    75% { opacity: 0.85; }
    100% { opacity: 0.78; }
}

/* Only show at night/dusk — fade in/out with sky transition */
.sky-night .ma-city-lights[b-3jm9jr4oqc] { opacity: 1; }
.sky-dusk  .ma-city-lights[b-3jm9jr4oqc] { opacity: 0.5; }
.sky-dawn  .ma-city-lights[b-3jm9jr4oqc] { opacity: 0.3; }
.sky-day   .ma-city-lights[b-3jm9jr4oqc] { opacity: 0.12; }

/* Paused state */
.is-paused .ma-city-lights[b-3jm9jr4oqc] { animation-play-state: paused !important; }

/* ── Mid-sky cloud layers (weather-responsive) ── */
/*
   Two independent layers scroll at different speeds for parallax depth.
   Opacity and tint are driven by the weather-* class on .ma-footer-sky.
   clear       → hidden
   partly-cloudy → sparse, white/light
   cloudy       → fuller, slightly grey
   drizzle/rain → dense, dark grey
   storm        → near-black, fast
   fog          → white-grey, slow, very opaque
   snow         → white, soft
*/
.ma-sky-clouds[b-3jm9jr4oqc] {
    position: absolute;
    top: 0;
    width: calc(100% + 800px);
    pointer-events: none;
    z-index: 3;
    opacity: 0;
    transition: opacity 2s ease, filter 2s ease;
}

.ma-sky-clouds-hi[b-3jm9jr4oqc] {
    height: 55%;
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 600 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cellipse cx='80' cy='72' rx='70' ry='28' fill='rgba(255,255,255,0.55)'/%3E%3Cellipse cx='70' cy='68' rx='45' ry='22' fill='rgba(255,255,255,0.4)'/%3E%3Cellipse cx='105' cy='65' rx='55' ry='24' fill='rgba(255,255,255,0.5)'/%3E%3Cellipse cx='300' cy='55' rx='90' ry='32' fill='rgba(255,255,255,0.45)'/%3E%3Cellipse cx='285' cy='52' rx='60' ry='25' fill='rgba(255,255,255,0.35)'/%3E%3Cellipse cx='330' cy='50' rx='70' ry='28' fill='rgba(255,255,255,0.4)'/%3E%3Cellipse cx='500' cy='78' rx='75' ry='26' fill='rgba(255,255,255,0.5)'/%3E%3Cellipse cx='488' cy='74' rx='50' ry='20' fill='rgba(255,255,255,0.38)'/%3E%3Cellipse cx='525' cy='72' rx='60' ry='22' fill='rgba(255,255,255,0.44)'/%3E%3C/svg%3E") repeat-x;
    background-size: 600px 100%;
    /* High clouds: 70s — noticeably faster than skyline (180s) for clear parallax depth */
    animation: ma-scroll-sky-hi-b-3jm9jr4oqc 70s linear infinite;
}

.ma-sky-clouds-lo[b-3jm9jr4oqc] {
    height: 48%;
    top: 8%;
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 800 110' xmlns='http://www.w3.org/2000/svg'%3E%3Cellipse cx='110' cy='80' rx='95' ry='30' fill='rgba(255,255,255,0.35)'/%3E%3Cellipse cx='95' cy='76' rx='65' ry='22' fill='rgba(255,255,255,0.28)'/%3E%3Cellipse cx='140' cy='74' rx='75' ry='26' fill='rgba(255,255,255,0.32)'/%3E%3Cellipse cx='370' cy='65' rx='110' ry='35' fill='rgba(255,255,255,0.30)'/%3E%3Cellipse cx='355' cy='60' rx='75' ry='26' fill='rgba(255,255,255,0.25)'/%3E%3Cellipse cx='410' cy='58' rx='85' ry='30' fill='rgba(255,255,255,0.28)'/%3E%3Cellipse cx='650' cy='75' rx='88' ry='28' fill='rgba(255,255,255,0.33)'/%3E%3Cellipse cx='635' cy='70' rx='58' ry='20' fill='rgba(255,255,255,0.26)'/%3E%3Cellipse cx='678' cy='68' rx='68' ry='24' fill='rgba(255,255,255,0.30)'/%3E%3C/svg%3E") repeat-x;
    background-size: 800px 100%;
    /* Low clouds: 115s — between hi-clouds (70s) and skyline (180s) for three-layer parallax */
    animation: ma-scroll-sky-lo-b-3jm9jr4oqc 115s linear infinite;
}

/* ── Cloud opacity driven directly by real cloudcover % from Open-Meteo ──
   --cloud-cover is 0-100, set as inline CSS variable on .ma-footer-sky.
   Hi layer peaks at 0.92 opacity at 100% cover; lo layer peaks at 0.72.
   weather-* classes still override filter for correct colour/darkness.
   Storm and fog get a floor opacity so they never drop below the dramatic minimum.
*/
.ma-sky-clouds-hi[b-3jm9jr4oqc] {
    opacity: calc(var(--cloud-cover, 0) / 100 * 0.92);
}
.ma-sky-clouds-lo[b-3jm9jr4oqc] {
    opacity: calc(var(--cloud-cover, 0) / 100 * 0.72);
}

/* clear — always fully hidden regardless of any residual CSS variable */
.weather-clear .ma-sky-clouds[b-3jm9jr4oqc] { opacity: 0 !important; }

/* partly-cloudy — brighter white tone */
.weather-partly-cloudy .ma-sky-clouds-hi[b-3jm9jr4oqc] { filter: brightness(1.1); }
.weather-partly-cloudy .ma-sky-clouds-lo[b-3jm9jr4oqc] { filter: brightness(1.05); }

/* cloudy — slightly muted */
.weather-cloudy .ma-sky-clouds-hi[b-3jm9jr4oqc] { filter: brightness(0.92) saturate(0.8); }
.weather-cloudy .ma-sky-clouds-lo[b-3jm9jr4oqc] { filter: brightness(0.88) saturate(0.8); }

/* drizzle — darker, denser */
.weather-drizzle .ma-sky-clouds-hi[b-3jm9jr4oqc] { filter: brightness(0.80) saturate(0.6) sepia(0.1); }
.weather-drizzle .ma-sky-clouds-lo[b-3jm9jr4oqc] { filter: brightness(0.75) saturate(0.6) sepia(0.1); }

/* rain — heavy dark cover */
.weather-rain .ma-sky-clouds-hi[b-3jm9jr4oqc] { filter: brightness(0.65) saturate(0.4) sepia(0.15); }
.weather-rain .ma-sky-clouds-lo[b-3jm9jr4oqc] { filter: brightness(0.60) saturate(0.4) sepia(0.15); }

/* snow — soft white billows */
.weather-snow .ma-sky-clouds-hi[b-3jm9jr4oqc] { filter: brightness(1.05) saturate(0.3); }
.weather-snow .ma-sky-clouds-lo[b-3jm9jr4oqc] { filter: brightness(1.0)  saturate(0.3); }

/* fog — dense white-grey, force minimum opacity + slow scroll */
.weather-fog .ma-sky-clouds-hi[b-3jm9jr4oqc] {
    opacity: max(calc(var(--cloud-cover, 80) / 100 * 0.92), 0.75) !important;
    filter: brightness(0.95) saturate(0.2);
    animation-duration: 200s;
}
.weather-fog .ma-sky-clouds-lo[b-3jm9jr4oqc] {
    opacity: max(calc(var(--cloud-cover, 80) / 100 * 0.72), 0.65) !important;
    filter: brightness(0.90) saturate(0.2);
    animation-duration: 240s;
}

/* storm — near-black, force minimum opacity + accelerate */
.weather-storm .ma-sky-clouds-hi[b-3jm9jr4oqc] {
    opacity: max(calc(var(--cloud-cover, 95) / 100 * 0.92), 0.88) !important;
    filter: brightness(0.45) saturate(0.2) sepia(0.2);
    animation-duration: 40s;
}
.weather-storm .ma-sky-clouds-lo[b-3jm9jr4oqc] {
    opacity: max(calc(var(--cloud-cover, 95) / 100 * 0.72), 0.78) !important;
    filter: brightness(0.38) saturate(0.2) sepia(0.2);
    animation-duration: 55s;
}

/* Night tinting — clouds become dark silhouettes */
.sky-night .ma-sky-clouds-hi[b-3jm9jr4oqc] { filter: brightness(0.25) !important; }
.sky-night .ma-sky-clouds-lo[b-3jm9jr4oqc] { filter: brightness(0.20) !important; }
.sky-dawn  .ma-sky-clouds-hi[b-3jm9jr4oqc] { filter: brightness(0.75) sepia(0.4) hue-rotate(-10deg) !important; }
.sky-dawn  .ma-sky-clouds-lo[b-3jm9jr4oqc] { filter: brightness(0.65) sepia(0.4) hue-rotate(-10deg) !important; }
.sky-dusk  .ma-sky-clouds-hi[b-3jm9jr4oqc] { filter: brightness(0.7) sepia(0.5) hue-rotate(-20deg) !important; }
.sky-dusk  .ma-sky-clouds-lo[b-3jm9jr4oqc] { filter: brightness(0.6) sepia(0.5) hue-rotate(-20deg) !important; }

/* No sky clouds at night when clear */
.sky-night .weather-clear .ma-sky-clouds[b-3jm9jr4oqc],
.weather-clear .ma-sky-clouds[b-3jm9jr4oqc] { opacity: 0 !important; }

@keyframes ma-scroll-sky-hi-b-3jm9jr4oqc {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-600px); }
}

@keyframes ma-scroll-sky-lo-b-3jm9jr4oqc {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-800px); }
}

.ma-birds[b-3jm9jr4oqc] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0; left: 0;
    z-index: 4;
    opacity: 1;
    transition: opacity 1.5s ease;
    pointer-events: none;
}
.sky-night .ma-birds[b-3jm9jr4oqc] { opacity: 0; }

.ma-bird-group[b-3jm9jr4oqc] {
    position: absolute;
    right: -100px;
    animation: ma-fly-birds-b-3jm9jr4oqc linear infinite;
}
.ma-bird-group.ma-bird-1[b-3jm9jr4oqc] { top: 20px; animation-duration: 45s; animation-delay: 5s; }
.ma-bird-group.ma-bird-2[b-3jm9jr4oqc] { top: 35px; animation-duration: 55s; animation-delay: 15s; }
.ma-bird-group.ma-bird-3[b-3jm9jr4oqc] { top: 10px; animation-duration: 38s; animation-delay: 35s; }

.ma-bird-2 .ma-bird-svg[b-3jm9jr4oqc] { width: 22px; }
.ma-bird-3 .ma-bird-svg[b-3jm9jr4oqc] { width: 16px; }

.ma-bird-svg[b-3jm9jr4oqc] {
    width: 28px;
    fill: #111;
    opacity: 0.7;
    animation: ma-flap-b-3jm9jr4oqc 0.4s alternate infinite ease-in-out;
}

.ma-dirigible[b-3jm9jr4oqc] {
    position: absolute;
    left: -195px;
    width: 180px;
    height: 108px;
    animation: ma-fly-across-b-3jm9jr4oqc 45s linear infinite;
    z-index: 10;
    transition: filter 1.5s ease, top 2.5s ease;
}

/* When docked: kill fly-across so inline left takes over; top transition handles descent/ascent */
.ma-dirigible.is-docked[b-3jm9jr4oqc] {
    animation: none;
}

/* Momentarily hidden while fly-across resets to left edge — prevents jump */
.ma-dirigible.is-resetting[b-3jm9jr4oqc] {
    animation: none;
    opacity: 0;
    left: -200px !important;
}

.ma-dirigible-bob[b-3jm9jr4oqc] {
    position: relative;
    width: 100%;
    height: 100%;
    animation: ma-dirigible-bob-b-3jm9jr4oqc 4s ease-in-out infinite alternate;
}

.ma-dirigible-bob img[b-3jm9jr4oqc] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.ma-dirigible-banner[b-3jm9jr4oqc] {
    position: absolute;
    left: 10px;
    top: 20px;
    width: 72px;
    background: #e8f3ff;
    border: 1px solid #2f6dbc;
    color: #1a407a;
    font-size: 8px;
    font-weight: 700;
    padding: 2px 4px;
    border-radius: 2px;
    text-align: center;
    box-shadow: 0 0 6px rgba(0, 80, 160, 0.35);
    transform: rotate(-2deg);
    white-space: nowrap;
    z-index: 40;
}


.ma-hot-air-balloon[b-3jm9jr4oqc] {
    position: absolute;
    left: var(--balloon-left, 6%);
    bottom: 0px;
    width: calc(120px * var(--balloon-scale, 1.0));
    height: calc(218px * var(--balloon-scale, 1.0));
    z-index: 1; /* behind skyline */
    pointer-events: none;
    animation: balloon-rise-b-3jm9jr4oqc 80s linear infinite;
    opacity: 1;
    visibility: visible;
    display: block;
    transform-origin: center bottom;
    border: none;
}

.ma-balloon-sign[b-3jm9jr4oqc] {
    position: absolute;
    left: 50%;
    top: 90%;
    transform: translateX(-50%);
    background: #ffffff;
    border: 1px solid #2a5894;
    color: #1d396c;
    font-size: 8px;
    font-weight: 700;
    padding: 2px 5px;
    border-radius: 2px;
    box-shadow: 0 0 5px rgba(0,0,0,0.25);
    white-space: nowrap;
}

.ma-balloon-sign[b-3jm9jr4oqc]::before,
.ma-balloon-sign[b-3jm9jr4oqc]::after {
    content: '';
    position: absolute;
    top: -2px;
    width: 1px;
    height: 2px;
    background: #4b5d76;
}

.ma-balloon-sign[b-3jm9jr4oqc]::before { left: 15px; }
.ma-balloon-sign[b-3jm9jr4oqc]::after  { right: 15px; }

.ma-plane[b-3jm9jr4oqc] {
    position: absolute;
    left: 50%;
    top: 6%;
    width: 220px;
    height: 90px;
    z-index: 8;
    pointer-events: none;
    --plane-angle: 0deg;
    --plane-scale: 0.18;
    --plane-y: -120px;
    --plane-offset: 0px;
    --plane-wing: #d4b870;
    --plane-body: #7a5830;
    --plane-cockpit: #4a3018;
    transform-origin: center center;
    filter: drop-shadow(0 8px 16px rgba(0,0,0,0.25)) blur(0.2px);
    transform: translateX(-50%) translateX(var(--plane-offset)) translateY(var(--plane-y)) scale(var(--plane-scale)) rotate(var(--plane-angle));
    animation:
        ma-plane-fly-b-3jm9jr4oqc 80s ease-in-out infinite,
        ma-plane-scale-b-3jm9jr4oqc 80s ease-in-out infinite,
        ma-plane-angle-b-3jm9jr4oqc 80s ease-in-out infinite,
        ma-plane-z-b-3jm9jr4oqc 80s linear infinite;
}

.ma-plane-bob[b-3jm9jr4oqc] {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    animation: ma-plane-sine-b-3jm9jr4oqc 3.2s ease-in-out infinite;
    transform-origin: center center;
}

.ma-plane svg[b-3jm9jr4oqc] {
    width: 100%;
    height: 100%;
    display: block;
}

.ma-plane .plane-wing[b-3jm9jr4oqc] {
    fill: var(--plane-wing);
    stroke: #4a3218;
    stroke-width: 1.6px;
}

.ma-plane .plane-body[b-3jm9jr4oqc] {
    fill: var(--plane-body);
    stroke: #3a2410;
    stroke-width: 1.5px;
}

.ma-plane .plane-cockpit[b-3jm9jr4oqc] {
    fill: var(--plane-cockpit);
    stroke: #3a2410;
    stroke-width: 1.2px;
}

.ma-plane .propeller-spin[b-3jm9jr4oqc] {
    transform-origin: 110px 42px;
    animation: ma-spin-b-3jm9jr4oqc 0.25s linear infinite;
}

.ma-plane .propeller-spin line[b-3jm9jr4oqc] {
    stroke: #c89040;
    stroke-width: 3;
    stroke-linecap: round;
    opacity: 0.95;
}

.ma-plane .propeller-spin circle[b-3jm9jr4oqc] {
    fill: #d4a050;
    stroke: #7a5020;
    stroke-width: 1;
    opacity: 0.98;
}

.ma-dirigible .propeller-spin[b-3jm9jr4oqc] {
    transform-origin: 40px 92px;
    animation: ma-spin-b-3jm9jr4oqc 0.3s linear infinite;
}

.sky-night .ma-dirigible-bob[b-3jm9jr4oqc] {
    filter: brightness(0.6) drop-shadow(0 6px 10px rgba(0,0,0,0.8));
}

@keyframes ma-plane-fly-b-3jm9jr4oqc {
    0% {
        --plane-y: -120px;
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    30% {
        --plane-y: 18px;
    }
    45% {
        --plane-y: 52px;
    }
    60% {
        --plane-y: 90px;
    }
    75% {
        --plane-y: 148px;
    }
    90% {
        --plane-y: 210px;
        opacity: 0.6;
    }
    100% {
        --plane-y: 310px;
        opacity: 0;
    }
}

@keyframes ma-plane-angle-b-3jm9jr4oqc {
    0% {
        --plane-angle: 0deg;
    }
    25% {
        --plane-angle: 4deg;
    }
    50% {
        --plane-angle: 0deg;
    }
    75% {
        --plane-angle: -3deg;
    }
    100% {
        --plane-angle: 12deg;
    }
}

@keyframes ma-plane-scale-b-3jm9jr4oqc {
    0% {
        --plane-scale: 0.16;
    }
    35% {
        --plane-scale: 0.44;
    }
    52% {
        --plane-scale: 0.9;
    }
    72% {
        --plane-scale: 1.3;
    }
    90% {
        --plane-scale: 1.85;
    }
    100% {
        --plane-scale: 2.2;
    }
}

@keyframes ma-plane-sine-b-3jm9jr4oqc {
    0%   { transform: translateY(0px); }
    20%  { transform: translateY(-2px); }
    40%  { transform: translateY(3px); }
    60%  { transform: translateY(-1px); }
    80%  { transform: translateY(1px); }
    100% { transform: translateY(0px); }
}

/* z-index steps: behind dirigible (z=10) while distant, in front once close */
@keyframes ma-plane-z-b-3jm9jr4oqc {
    0%   { z-index: 8; }
    45%  { z-index: 8; }
    46%  { z-index: 12; }
    100% { z-index: 12; }
}

/* ── Witch on broomstick ── */
.ma-witch[b-3jm9jr4oqc] {
    position: absolute;
    left: 0;
    z-index: 9;
    pointer-events: none;
    width: 68px;
    height: 51px;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,0.6));
    animation: ma-witch-fly-b-3jm9jr4oqc 300s linear infinite;
}

.ma-witch img[b-3jm9jr4oqc] {
    animation: ma-witch-bob-b-3jm9jr4oqc 2.2s ease-in-out infinite alternate;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.ma-witch-1[b-3jm9jr4oqc] { top: 28%; animation-delay: 0s; }
.ma-witch-2[b-3jm9jr4oqc] { top: 38%; animation-delay: -150s; }

.sky-night .ma-witch[b-3jm9jr4oqc] {
    filter: brightness(0.75) drop-shadow(0 2px 8px rgba(0,0,0,0.95));
}
.sky-night .cabin-lights[b-3jm9jr4oqc] { fill: #fff185 !important; }
.sky-dusk .cabin-lights[b-3jm9jr4oqc], .sky-dawn .cabin-lights[b-3jm9jr4oqc] { fill: #ffdf65 !important; }
.sky-day .cabin-lights[b-3jm9jr4oqc] { fill: #444 !important; }

@keyframes ma-fly-across-b-3jm9jr4oqc {
    0%   { transform: translateX(0); }
    100% { transform: translateX(calc(100vw + 300px)); }
}

@keyframes ma-dirigible-bob-b-3jm9jr4oqc {
    0%   { transform: translateY(0px) rotate(0deg); }
    30%  { transform: translateY(-5px) rotate(0.4deg); }
    60%  { transform: translateY(-3px) rotate(-0.3deg); }
    100% { transform: translateY(-8px) rotate(0.6deg); }
}

/* Smoke trail — dark wisps from rear of gondola engine, streaming behind (leftward) */
.ma-dirigible.has-smoke .ma-dirigible-bob[b-3jm9jr4oqc]::before,
.ma-dirigible.has-smoke .ma-dirigible-bob[b-3jm9jr4oqc]::after {
    content: '';
    position: absolute;
    border-radius: 40% 60% 60% 40% / 50% 50% 50% 50%;
    background: rgba(52, 44, 36, 0.8);
    pointer-events: none;
}

/* Smoke rises from chimney top — approx left:77px, top:52px in 180×108px element */
.ma-dirigible.has-smoke .ma-dirigible-bob[b-3jm9jr4oqc]::before {
    width: 8px;
    height: 8px;
    left: 77px;
    top: 52px;
    animation: ma-smoke-trail-1-b-3jm9jr4oqc 1.8s ease-out infinite;
    animation-delay: 0s;
}

.ma-dirigible.has-smoke .ma-dirigible-bob[b-3jm9jr4oqc]::after {
    width: 6px;
    height: 6px;
    left: 80px;
    top: 52px;
    animation: ma-smoke-trail-2-b-3jm9jr4oqc 1.8s ease-out infinite;
    animation-delay: 0.9s;
}

@keyframes ma-smoke-trail-1-b-3jm9jr4oqc {
    0%   { transform: translateY(0)      translateX(0)     scale(1);   opacity: 0.8; }
    60%  { transform: translateY(-10px)  translateX(-30px) scale(2.0); opacity: 0.4; }
    100% { transform: translateY(-18px)  translateX(-58px) scale(3.0); opacity: 0; }
}

@keyframes ma-smoke-trail-2-b-3jm9jr4oqc {
    0%   { transform: translateY(0)      translateX(0)     scale(1);   opacity: 0.65; }
    60%  { transform: translateY(-8px)   translateX(-26px) scale(1.8); opacity: 0.3; }
    100% { transform: translateY(-14px)  translateX(-48px) scale(2.6); opacity: 0; }
}

@keyframes ma-witch-fly-b-3jm9jr4oqc {
    0%    { transform: translateX(calc(100vw + 80px)); opacity: 0; }
    3%    { transform: translateX(calc(100vw + 80px)); opacity: 0; }
    5%    { transform: translateX(calc(100vw + 40px)); opacity: 1; }
    16%   { transform: translateX(-80px);              opacity: 1; }
    18%   { transform: translateX(-120px);             opacity: 0; }
    100%  { transform: translateX(calc(100vw + 80px)); opacity: 0; }
}

@keyframes ma-witch-bob-b-3jm9jr4oqc {
    from { transform: translateY(0) rotate(-2deg); }
    to   { transform: translateY(-5px) rotate(1deg); }
}

@keyframes ma-scroll-clouds-b-3jm9jr4oqc {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-200px); }
}

@keyframes ma-scroll-skyline-b-3jm9jr4oqc {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-4000px); }
}

@keyframes ma-shoot-b-3jm9jr4oqc {
    0%   { transform: translate(0, 0) rotate(-15deg); opacity: 0; }
    2%   { opacity: 1; }
    6%   { transform: translate(-300px, 80px) rotate(-15deg); opacity: 0; }
    100% { opacity: 0; }
}

@keyframes ma-fly-birds-b-3jm9jr4oqc {
    0%   { right: -100px; transform: translateY(0); }
    50%  { transform: translateY(-15px); }
    100% { right: 110%; transform: translateY(0); }
}

@keyframes ma-flap-b-3jm9jr4oqc {
    0%   { transform: scaleY(1); }
    100% { transform: scaleY(0.2); }
}

@keyframes ma-spin-b-3jm9jr4oqc {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes ma-propeller-glow-b-3jm9jr4oqc {
    0%   { filter: drop-shadow(0 0 3px rgba(255,255,255,0.5)); opacity: 0.8; }
    50%  { filter: drop-shadow(0 0 8px rgba(255,255,255,0.85)); opacity: 1; }
    100% { filter: drop-shadow(0 0 3px rgba(255,255,255,0.5)); opacity: 0.8; }
}

.propeller-spin[b-3jm9jr4oqc] {
    transform-origin: 48px 61px;
    animation: ma-spin-b-3jm9jr4oqc 0.18s linear infinite, ma-propeller-glow-b-3jm9jr4oqc 0.18s ease-in-out infinite;
    animation-play-state: running;
}



/* ── Fog & lightning weather overlays ── */
.ma-fog-layer[b-3jm9jr4oqc] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 5;
    opacity: 0;
    background: linear-gradient(to top, rgba(200,210,220,0.55) 0%, rgba(200,210,220,0.15) 60%, transparent 100%);
    transition: opacity 2s ease;
}
.weather-fog .ma-fog-layer[b-3jm9jr4oqc] { opacity: 1; }

.ma-lightning-layer[b-3jm9jr4oqc] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 6;
    opacity: 0;
    background: rgba(180,200,255,0.08);
    animation: ma-lightning-flash-b-3jm9jr4oqc 8s linear infinite;
}
.weather-storm .ma-lightning-layer[b-3jm9jr4oqc] { opacity: 1; }

@keyframes ma-lightning-flash-b-3jm9jr4oqc {
    0%, 48%, 52%, 100% { opacity: 0; }
    49%, 51%            { opacity: 1; }
}

/* ── Weather effects ── */
.ma-weather-overlay[b-3jm9jr4oqc] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    transition: opacity 1.5s ease;
}

/* Rain layer */
.ma-rain-layer[b-3jm9jr4oqc] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
    display: none;
}

.weather-rain .ma-rain-layer[b-3jm9jr4oqc],
.weather-drizzle .ma-rain-layer[b-3jm9jr4oqc] {
    display: block;
}

.ma-raindrop[b-3jm9jr4oqc] {
    position: absolute;
    top: -20px;
    width: 1.5px;
    height: 18px;
    background: rgba(180, 210, 240, 0.7);
    border-radius: 2px;
    animation: ma-rain-fall-b-3jm9jr4oqc linear infinite;
}

.weather-drizzle .ma-raindrop[b-3jm9jr4oqc] {
    height: 7px;
    background: rgba(180, 210, 240, 0.4);
    width: 1px;
}

@keyframes ma-rain-fall-b-3jm9jr4oqc {
    0%   { transform: translateY(-20px) rotate(10deg); opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 1; }
    100% { transform: translateY(calc(100vh + 20px)) rotate(10deg); opacity: 0; }
}

/* Snow layer */
.ma-snow-layer[b-3jm9jr4oqc] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
    display: none;
}

.weather-snow .ma-snow-layer[b-3jm9jr4oqc] {
    display: block;
}

.ma-snowflake[b-3jm9jr4oqc] {
    position: absolute;
    top: -10px;
    width: 5px;
    height: 5px;
    background: rgba(255, 255, 255, 0.85);
    border-radius: 50%;
    animation: ma-snow-fall-b-3jm9jr4oqc linear infinite;
}

@keyframes ma-snow-fall-b-3jm9jr4oqc {
    0%   { transform: translateY(-10px) translateX(0); opacity: 0; }
    8%   { opacity: 0.9; }
    30%  { transform: translateY(25%) translateX(12px); }
    60%  { transform: translateY(55%) translateX(-8px); }
    85%  { opacity: 0.85; }
    100% { transform: translateY(100vh) translateX(10px); opacity: 0; }
}

/* Snow accumulation ridge at the base of the sky panel */
.ma-snow-accumulation[b-3jm9jr4oqc] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0;
    background: linear-gradient(to top, rgba(255,255,255,0.88) 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
    transition: height 10s ease;
    pointer-events: none;
    z-index: 5;
    border-radius: 40% 60% 0 0 / 8px 8px 0 0;
}

.weather-snow .ma-snow-accumulation[b-3jm9jr4oqc] {
    height: 20px;
}

/* Fog layer */
.ma-fog-layer[b-3jm9jr4oqc] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 3;
    background: radial-gradient(ellipse at 50% 80%, rgba(200,210,220,0.45) 0%, rgba(200,210,220,0.1) 60%, transparent 100%);
    opacity: 0;
    transition: opacity 2s ease;
}

.weather-fog .ma-fog-layer[b-3jm9jr4oqc] {
    opacity: 1;
    animation: ma-fog-drift-b-3jm9jr4oqc 12s ease-in-out infinite alternate;
}

@keyframes ma-fog-drift-b-3jm9jr4oqc {
    from { background-position: 0% 50%; opacity: 0.7; }
    to   { background-position: 100% 50%; opacity: 0.9; }
}

/* Storm / lightning */
.ma-lightning-layer[b-3jm9jr4oqc] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 7;
    display: none;
}

.weather-storm .ma-lightning-layer[b-3jm9jr4oqc] {
    display: block;
    animation: ma-lightning-flash-b-3jm9jr4oqc 7s ease-in-out infinite;
}

@keyframes ma-lightning-flash-b-3jm9jr4oqc {
    0%, 88%, 100% { background: rgba(200, 220, 255, 0); }
    90%           { background: rgba(210, 230, 255, 0.28); }
    91%           { background: rgba(200, 220, 255, 0); }
    93%           { background: rgba(210, 230, 255, 0.45); }
    94%           { background: rgba(200, 220, 255, 0); }
}

/* Individual lightning bolt SVGs */
.ma-bolt[b-3jm9jr4oqc] {
    position: absolute;
    top: 5%;
    opacity: 0;
    pointer-events: none;
    filter: drop-shadow(0 0 6px rgba(180, 210, 255, 0.9)) drop-shadow(0 0 14px rgba(140, 180, 255, 0.6));
}

.ma-bolt-1[b-3jm9jr4oqc] {
    left: 28%;
    width: 40px;
    height: 120px;
    animation: ma-bolt-strike-b-3jm9jr4oqc 7s ease-in-out infinite;
}

.ma-bolt-2[b-3jm9jr4oqc] {
    left: 62%;
    width: 30px;
    height: 100px;
    animation: ma-bolt-strike-b-3jm9jr4oqc 7s ease-in-out infinite 1.1s;
}

@keyframes ma-bolt-strike-b-3jm9jr4oqc {
    0%, 88%, 100% { opacity: 0; }
    90%           { opacity: 1; }
    91%           { opacity: 0; }
    93%           { opacity: 0.9; }
    94%           { opacity: 0; }
}

/* Storm darkens the sky overlay */
.weather-storm .ma-weather-overlay[b-3jm9jr4oqc] {
    opacity: 1;
    background: rgba(20, 10, 40, 0.3);
}

/* Heavy clouds reduce cloud opacity / darken */
.weather-cloudy .ma-clouds[b-3jm9jr4oqc],
.weather-rain .ma-clouds[b-3jm9jr4oqc],
.weather-storm .ma-clouds[b-3jm9jr4oqc] {
    opacity: 0.85;
    filter: brightness(0.7);
}

/* Fog slightly dims birds and dirigible */
.weather-fog .ma-birds[b-3jm9jr4oqc] { opacity: 0.3; }
.weather-fog .ma-dirigible[b-3jm9jr4oqc] { filter: brightness(0.7) blur(0.5px) drop-shadow(0 4px 8px rgba(0,0,0,0.3)); }

.is-paused .ma-docking-scene[b-3jm9jr4oqc] { pointer-events: none; }
.is-paused .ma-passenger[b-3jm9jr4oqc] { transition: none; }

.is-paused .ma-dirigible[b-3jm9jr4oqc],
.is-paused .ma-dirigible-bob[b-3jm9jr4oqc],
.is-paused .ma-dirigible-bob[b-3jm9jr4oqc]::before,
.is-paused .ma-dirigible-bob[b-3jm9jr4oqc]::after,
.is-paused .ma-plane[b-3jm9jr4oqc],
.is-paused .ma-plane-bob[b-3jm9jr4oqc],
.is-paused .ma-plane-bob[b-3jm9jr4oqc]::before,
.is-paused .ma-plane-bob[b-3jm9jr4oqc]::after,
.is-paused .ma-sky-clouds[b-3jm9jr4oqc],
.is-paused .ma-stars[b-3jm9jr4oqc],
.is-paused .propeller-spin[b-3jm9jr4oqc],
.is-paused .ma-skyline[b-3jm9jr4oqc],
.is-paused .ma-city-lights[b-3jm9jr4oqc],
.is-paused .ma-bird-group[b-3jm9jr4oqc],
.is-paused .ma-bird-svg[b-3jm9jr4oqc],
.is-paused .ma-star-trail[b-3jm9jr4oqc],
.is-paused .ma-witch[b-3jm9jr4oqc],
.is-paused .ma-witch svg[b-3jm9jr4oqc],
.is-paused .ma-raindrop[b-3jm9jr4oqc],
.is-paused .ma-snowflake[b-3jm9jr4oqc],
.is-paused .ma-lightning-layer[b-3jm9jr4oqc],
.is-paused .ma-hot-air-balloon[b-3jm9jr4oqc],
.is-paused .glow-slow[b-3jm9jr4oqc] {
    animation-play-state: paused !important;
}

/* =================================================================
   TEXT-ONLY OVERRIDES
   ================================================================= */
.text-only .ma-footer[b-3jm9jr4oqc] {
    background: var(--bs-body-bg) !important;
    border-top: 1px solid var(--bs-border-color) !important;
}

.text-only .ma-footer-body[b-3jm9jr4oqc] {
    background: var(--bs-body-bg) !important;
    padding: 0.5rem 0.75rem !important;
}


/* In text-only, follow theme rather than time-of-day. Dark theme uses the light logo. */
.text-only .ma-footer-logo-img--dark[b-3jm9jr4oqc]  { display: block; }
.text-only .ma-footer-logo-img--light[b-3jm9jr4oqc] { display: none; }

[data-bs-theme=light] .text-only .ma-footer-logo-img--dark[b-3jm9jr4oqc]  { display: none; }
[data-bs-theme=light] .text-only .ma-footer-logo-img--light[b-3jm9jr4oqc] { display: block; }

.text-only .ma-footer-rule[b-3jm9jr4oqc] {
    display: none;
}

.text-only .ma-footer-bottom[b-3jm9jr4oqc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--bs-body-color);
    background: transparent;
    border-top: 0;
}

.text-only .ma-footer-tagline[b-3jm9jr4oqc],
.text-only .ma-footer-bottom-amber[b-3jm9jr4oqc],
.text-only .ma-footer-copyright[b-3jm9jr4oqc] {
    display: block;
    color: var(--bs-body-color) !important;
    font-family: var(--bs-font-sans-serif) !important;
    font-size: 0.9rem !important;
    font-weight: normal !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    text-shadow: none !important;
    text-decoration: none !important;
    margin: 0.05rem 0 !important;
    line-height: 1.1 !important;
    background: transparent !important;
    opacity: 1 !important;
    filter: none !important;
}

.text-only .ma-footer-link[b-3jm9jr4oqc] {
    font-family: var(--bs-font-sans-serif) !important;
    color: var(--bs-body-color) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-shadow: none !important;
}

.text-only .ma-footer-link:hover[b-3jm9jr4oqc] {
    color: var(--bs-body-color);
    text-decoration: underline;
}

.text-only .ma-footer-links[b-3jm9jr4oqc] {
    border-color: var(--bs-border-color);
}

.text-only .ma-footer-copy[b-3jm9jr4oqc] {
    font-family: var(--bs-font-sans-serif) !important;
    color: var(--bs-secondary-color) !important;
    letter-spacing: 0 !important;
    text-shadow: none !important;
    margin: 0 !important;
}

.text-only .ma-footer-copy a[b-3jm9jr4oqc] {
    color: var(--bs-body-color) !important;
    text-shadow: none !important;
}

.text-only .ma-footer-copy p[b-3jm9jr4oqc] {
    color: var(--bs-body-color) !important;
    text-shadow: none !important;
    margin-bottom: 0 !important;
}

.text-only .logo_4[b-3jm9jr4oqc] {
    fill: var(--bs-body-color);
}

.text-only .logo_8[b-3jm9jr4oqc] {
    fill: var(--bs-secondary-color);
}

.text-only .ma-footer-social-link[b-3jm9jr4oqc] {
    border-color: var(--bs-border-color);
    background: transparent;
}

.text-only .ma-footer-social-img[b-3jm9jr4oqc] {
    filter: none;
    opacity: 0.75;
}

.text-only .ma-footer-sky[b-3jm9jr4oqc],
.text-only .ma-sky-controls[b-3jm9jr4oqc] {
    display: none !important;
}


/* Override: Vintage biplane fly-in (front view) with depth scale and dive-away */
.ma-plane[b-3jm9jr4oqc] {
    position: absolute;
    left: 50%;
    right: auto;
    top: 12%;
    width: 140px;
    height: 140px;
    z-index: 11;
    pointer-events: none;
    transform: translateX(-50%);
    animation: ma-plane-fly-b-3jm9jr4oqc 22s ease-in-out infinite;
    transform-origin: center center;
}

.ma-plane-bob[b-3jm9jr4oqc] {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    animation: ma-plane-sine-b-3jm9jr4oqc 3.2s ease-in-out infinite;
    transform-origin: center center;
}

.ma-plane svg[b-3jm9jr4oqc] {
    width: 100%;
    height: 100%;
    display: block;
}

.ma-plane .propeller-spin[b-3jm9jr4oqc] {
    transform-origin: 50% 50%;
    animation: ma-spin-b-3jm9jr4oqc 0.18s linear infinite;
}

@keyframes ma-plane-fly-b-3jm9jr4oqc {
    0% {
        transform: translateX(-50%) translateY(-120px) scale(0.16) rotate(0deg);
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    30% {
        transform: translateX(-50%) translateY(20px) scale(0.42) rotate(1deg);
    }
    55% {
        transform: translateX(-50%) translateY(110px) scale(0.8) rotate(2deg);
    }
    72% {
        transform: translateX(-50%) translateY(190px) scale(1.20) rotate(3deg);
    }
    80% {
        transform: translateX(-50%) translateY(260px) scale(1.65) rotate(7deg);
    }
    90% {
        transform: translateX(-50%) translateY(320px) scale(1.95) rotate(12deg);
        opacity: 0.65;
    }
    100% {
        transform: translateX(-50%) translateY(420px) scale(2.3) rotate(18deg);
        opacity: 0;
    }
}

@keyframes ma-plane-sine-b-3jm9jr4oqc {
    0%   { transform: translateY(0px); }
    15%  { transform: translateY(-8px); }
    30%  { transform: translateY(6px); }
    45%  { transform: translateY(-6px); }
    60%  { transform: translateY(8px); }
    75%  { transform: translateY(-5px); }
    90%  { transform: translateY(3px); }
    100% { transform: translateY(0px); }
}

/* /Components/Navigation/Navmenu.razor.rz.scp.css */
/* -------------------------------------------------------------------
   MOIST AIR — Horizontal Split-Flap Departures Board Navigation
   Reference: github.com/tomgiddings/airport-board
   ------------------------------------------------------------------- */

/* ── Header shell ── */
.ma-header[b-qrwzzzc6a3] {
    --ma-header-height: 88px;
    background: var(--board-bg);
    border-bottom: 3px solid var(--board-frame);
    box-shadow: 0 4px 24px rgba(0,0,0,0.7);
    position: sticky;
    top: 0;
    z-index: 1100;
    width: 100%;
    max-width: 100vw;
    overflow: visible;
}

/* Authoritative component-scoped overrides: ensure utility buttons
   (search, basket, menu, notifications) match primary button tokens
   in both light and dark themes. These rules are placed in the component
   CSS so Blazor will append the correct scope attribute and they will
   reliably match the runtime elements. Use !important to win the
   cascade against any remaining global rules. */

/* Simplified explicit button colors for navigation bar — amber in normal mode only */
html:not(.text-only) .ma-utility-bar .ma-search-btn[b-qrwzzzc6a3],
html:not(.text-only) .ma-utility-bar .ma-basket-btn[b-qrwzzzc6a3],
html:not(.text-only) .ma-utility-bar .notifications-dropdown-toggle[b-qrwzzzc6a3] {
    background-color: #ffe082 !important; /* Amber */
    border: 1px solid #ffe082 !important;
    color: #222a35 !important;
}

html:not(.text-only) .ma-utility-bar .ma-search-btn:hover[b-qrwzzzc6a3],
html:not(.text-only) .ma-utility-bar .ma-basket-btn:hover[b-qrwzzzc6a3],
html:not(.text-only) .ma-utility-bar .notifications-dropdown-toggle:hover[b-qrwzzzc6a3],
html:not(.text-only) .ma-utility-bar .ma-search-btn:focus-visible[b-qrwzzzc6a3],
html:not(.text-only) .ma-utility-bar .ma-basket-btn:focus-visible[b-qrwzzzc6a3],
html:not(.text-only) .ma-utility-bar .notifications-dropdown-toggle:focus-visible[b-qrwzzzc6a3] {
    background-color: #ffd54f !important; /* lighter amber */
    border-color: #ffe082 !important;
    color: #222a35 !important;
}

/* Keep the login/user button amber in normal mode */
html:not(.text-only) .ma-utility-bar .ma-user-btn[b-qrwzzzc6a3] {
    background-color: #ffe082 !important; /* Amber */
    border: 1px solid #ffe082 !important;
    color: #222a35 !important;
}

/* Extra guard: ensure no separator (borders/shadows) remains between the
   board row and the utility row at desktop widths. Use higher specificity
   and !important to override earlier rules. */
@media (min-width: 992px) {
    .ma-header .ma-board[b-qrwzzzc6a3],
    .ma-header .ma-utility-bar[b-qrwzzzc6a3],
    .ma-header .ma-board-divider[b-qrwzzzc6a3] {
        border: none !important;
        box-shadow: none !important;
        background-clip: padding-box !important;
    }

    /* also ensure any pseudo-elements that might draw a line are hidden */
    .ma-header .ma-board[b-qrwzzzc6a3]::after,
    .ma-header .ma-utility-bar[b-qrwzzzc6a3]::before {
        display: none !important;
        content: none !important;
    }
}

/* ── Horizontal board strip ── */
.ma-board[b-qrwzzzc6a3] {
    display: flex;
    flex-direction: row;
    /* allow children to stretch to the full board height so column
       links can occupy the full vertical space and produce symmetric
       hover highlights */
    align-items: stretch;
    background: var(--board-bg);
    border-bottom: 2px solid var(--board-frame);
    min-height: 80px; /* small increase so hover highlights are not clipped */
    padding: 0 10px; /* slight horizontal padding for breathing room */
    overflow: visible;
    gap: 0;
}

/* Desktop layout: grid with logo column spanning both board and utility bar */
@media (min-width: 992px) {
    .ma-header[b-qrwzzzc6a3] {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto;
        align-items: stretch;
        gap: 0;
    }
}

/* TEXT-ONLY MODE: simplify utility buttons */
.text-only .ma-utility-bar .ma-search-btn[b-qrwzzzc6a3],
.text-only .ma-utility-bar .ma-basket-btn[b-qrwzzzc6a3],
.text-only .ma-utility-bar .notifications-dropdown-toggle[b-qrwzzzc6a3],
.text-only .ma-utility-bar .ma-user-btn[b-qrwzzzc6a3] {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    color: var(--bs-body-color) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-family: var(--bs-font-sans-serif) !important;
    letter-spacing: normal !important;
    font-weight: 400 !important;
}

.text-only .ma-utility-bar .ma-search-btn:hover[b-qrwzzzc6a3],
.text-only .ma-utility-bar .ma-basket-btn:hover[b-qrwzzzc6a3],
.text-only .ma-utility-bar .notifications-dropdown-toggle:hover[b-qrwzzzc6a3],
.text-only .ma-utility-bar .ma-user-btn:hover[b-qrwzzzc6a3],
.text-only .ma-utility-bar .ma-search-btn:focus-visible[b-qrwzzzc6a3],
.text-only .ma-utility-bar .ma-basket-btn:focus-visible[b-qrwzzzc6a3],
.text-only .ma-utility-bar .notifications-dropdown-toggle:focus-visible[b-qrwzzzc6a3],
.text-only .ma-utility-bar .ma-user-btn:focus-visible[b-qrwzzzc6a3] {
    background: var(--bs-secondary-bg) !important;
    background-color: var(--bs-secondary-bg) !important;
    border-color: var(--bs-border-color) !important;
    color: var(--bs-body-color) !important;
    text-decoration: none !important;
}

    .ma-nameplate[b-qrwzzzc6a3] {
        grid-column: 1 / 2;
        grid-row: 1 / 3; /* span both rows */
        align-self: stretch;
        /* center the logo horizontally within the nameplate column */
        justify-self: center;
        /* reduce horizontal padding so the board/search area starts closer */
        padding: 8px 8px;
        width: 140px; /* slightly narrower column to tighten spacing */
    }

    .ma-board[b-qrwzzzc6a3] {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
    }

    .ma-utility-bar[b-qrwzzzc6a3] {
        grid-column: 2 / 3;
        grid-row: 2 / 3;
    }

/* Remove the visible separator between the two header rows. Also remove
   the horizontal borders between the board and utility bar to create a
   seamless header area. */
.ma-header .ma-board-divider[b-qrwzzzc6a3] { display: none !important; }


/* Prevent underlines on links inside the header / navigation. Keep hover
   background & focus styles intact but remove text-decoration. */
.ma-header .ma-col-link[b-qrwzzzc6a3],
.ma-header .ma-sub-row[b-qrwzzzc6a3],
.ma-header .ma-mobile-row[b-qrwzzzc6a3],
.ma-header .ma-sub-row > a[b-qrwzzzc6a3] {
    text-decoration: none !important;
    border-bottom: none !important; /* disable global dotted underline */
    
}
.ma-header a:hover[b-qrwzzzc6a3],
.ma-header a:focus[b-qrwzzzc6a3],
.ma-header a:focus-visible[b-qrwzzzc6a3],
.ma-header .ma-col-link:hover[b-qrwzzzc6a3],
.ma-header .ma-sub-row:hover[b-qrwzzzc6a3],
.ma-header .ma-mobile-row:hover[b-qrwzzzc6a3] {
    text-decoration: none !important;
    border-bottom: none !important;
}

/* ── Nameplate (left logo block) ── */
.ma-nameplate[b-qrwzzzc6a3] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
    padding: 4px 10px 4px 4px;
    text-decoration: none;
    flex-shrink: 0;
    white-space: nowrap;
    border-bottom:none !important
}

.ma-nameplate-logo[b-qrwzzzc6a3] {
    height: 100%;
    width: auto;
    display: block;
}

/* Dark bg logo shown by default (board chrome is always dark) */
.ma-nameplate-logo--light[b-qrwzzzc6a3] { display: none; }
.ma-nameplate-logo--dark[b-qrwzzzc6a3]  { display: block; }

[data-bs-theme=light] .ma-nameplate-logo--dark[b-qrwzzzc6a3]  { display: none; }
[data-bs-theme=light] .ma-nameplate-logo--light[b-qrwzzzc6a3] { display: block; }

/* Explicitly ensure only the appropriate logo shows in dark mode as well */
[data-bs-theme=dark] .ma-nameplate-logo--light[b-qrwzzzc6a3] { display: none !important; }
[data-bs-theme=dark] .ma-nameplate-logo--dark[b-qrwzzzc6a3]  { display: block !important; }

.ma-mobile-nameplate[b-qrwzzzc6a3] {
    display: none;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    flex-shrink: 0;
    padding-right: 0.25rem;
}

.ma-mobile-nameplate-logo[b-qrwzzzc6a3] {
    height: 42px;
    width: auto;
    display: block;
}

.ma-mobile-nameplate-logo--light[b-qrwzzzc6a3] { display: none; }
.ma-mobile-nameplate-logo--dark[b-qrwzzzc6a3]  { display: block; }

[data-bs-theme=light] .ma-mobile-nameplate-logo--dark[b-qrwzzzc6a3]  { display: none; }
[data-bs-theme=light] .ma-mobile-nameplate-logo--light[b-qrwzzzc6a3] { display: block; }

/* Mobile logo explicit dark-theme rules */
[data-bs-theme=dark] .ma-mobile-nameplate-logo--light[b-qrwzzzc6a3] { display: none !important; }
[data-bs-theme=dark] .ma-mobile-nameplate-logo--dark[b-qrwzzzc6a3]  { display: block !important; }

.ma-clock[b-qrwzzzc6a3] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.85rem;
    color: var(--board-amber);
    letter-spacing: 0.15em;
    text-shadow: 0 0 8px var(--board-amber-dim);
}

/* ── Thin brass rule between nameplate and nav ── */
.ma-board-divider[b-qrwzzzc6a3] {
    width: 2px;
    align-self: stretch;
    background: var(--board-frame);
    margin: 0 10px;
    flex-shrink: 0;
    opacity: 0.6;
}

@media (min-width: 992px) {
    /* position the divider at the left edge of the second column so it
       visually separates the nameplate from the nav/utility areas */
    .ma-board-divider.d-none.d-lg-block[b-qrwzzzc6a3] {
        display: block !important;
        grid-column: 2 / 3;
        grid-row: 1 / 3;
        justify-self: start;
        margin: 0;
    }

    /* Constrain logo image to the nameplate column and preserve aspect */
    .ma-nameplate-logo[b-qrwzzzc6a3] {
        max-width: 140px;
        max-height: calc(100% - 16px);
        height: auto;
        width: auto;
        display: block;
    }

    /* Move the search to the right side of the utility bar on desktop so it
       doesn't competing with the logo. The flex wrapper becomes right-aligned. */
    .ma-utility-bar > .flex-grow-1[b-qrwzzzc6a3] {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        flex: 1 1 auto;
        min-width: 0;
    }

    .ma-utility-bar .ma-search[b-qrwzzzc6a3] {
        flex: 1 1 0;
        min-width: 0;
        max-width: min(760px, 60%);
        width: 100%;
        /* reduce gap between nameplate and search/button area */
        margin-left: 8px;
    }
}

/* ── Column nav strip — one continuous board panel ── */
.ma-cols[b-qrwzzzc6a3] {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    flex: 1;
    overflow: visible;
    gap: 0;
    justify-content: flex-start;
    background: var(--board-bg);

    /* ensure the column strip stretches to fill the .ma-board height
       (parent uses align-items:center so children do not automatically stretch) */
    align-self: stretch;
    height: 100%;
}

/* ── Individual destination column ── */
.ma-col[b-qrwzzzc6a3] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* Make columns distribute space evenly regardless of content by
       using a zero flex-basis. Also allow shrinking below content width
       by setting min-width:0 so long words don't force uneven columns. */
    flex: 1 1 0;
    min-width: 0;
    /* remove per-column padding and let the link control vertical spacing */
    padding: 0;
}

.ma-col:last-child[b-qrwzzzc6a3] {
    border-right: none;
}

/* ── Column link — fills column, flaps inline with badge to the right ── */
.ma-col-link[b-qrwzzzc6a3] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    /* control vertical spacing here so the hover background is symmetric */
    padding: 10px 12px; /* top/bottom, left/right */
    text-decoration: none;
    cursor: pointer;
    width: 100%;
    /* fill the column height so the hover background has even top/bottom
       spacing regardless of internal pseudo-element clipping */
    height: 100%;
    box-sizing: border-box;
    min-width: 0; /* allow the link to shrink inside the flex column */
    overflow: hidden; /* prevent long content from expanding the column */
    transition: background 120ms ease;
}

.ma-col-link:hover[b-qrwzzzc6a3],
.ma-col-link:focus-visible[b-qrwzzzc6a3] {
    background: rgba(184,134,11,0.08);
    outline: none;
}

/* ── Flap group — seamless cell strip ── */
.ma-col-flaps[b-qrwzzzc6a3] {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    /* center the flap cells vertically so the hover background has equal
       top and bottom spacing (prevents the top-looking padding from
       appearing larger than the bottom) */
    align-items: center;
    gap: 0;
}

/* =================================================================
   SPLIT-FLAP CELL
   Technique from tomgiddings/airport-board:
     ::before = top half  — clips at 50% height, shows top of char
     ::after  = bottom half — negative margin-top, shows bottom of char
   content: attr(data-char) — JS writes data-char to change the letter
   ================================================================= */
.ma-flap[b-qrwzzzc6a3] {
    background: var(--board-flap);
    border-right: 1px solid var(--board-bg);
    color: transparent;
    display: flex;
    flex-direction: column;
    height: 44px;
    width: 22px;
    position: relative;
    flex-shrink: 0;
}

.ma-flap[b-qrwzzzc6a3]::before {
    background: var(--board-flap);
    border-bottom: 1px solid rgba(255,255,255,0.12);
    content: attr(data-char);
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 28px;
    font-weight: 600;
    line-height: 44px;
    height: 22px;
    overflow: hidden;
    text-align: center;
    width: 100%;
    color: var(--board-amber);
    text-shadow: 0 0 8px var(--board-amber-dim);
    z-index: 2;
    display: block;
}

.ma-flap[b-qrwzzzc6a3]::after {
    background: var(--board-flap-line);
    content: attr(data-char);
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 28px;
    font-weight: 600;
    line-height: 44px;
    height: 44px;
    margin-top: -22px;
    overflow: hidden;
    text-align: center;
    width: 100%;
    color: var(--board-amber);
    opacity: 0.7;
    text-shadow: 0 0 5px var(--board-amber-dim);
    z-index: 1;
    display: block;
}

.ma-flap[data-char=" "][b-qrwzzzc6a3]::before,
.ma-flap[data-char=" "][b-qrwzzzc6a3]::after {
    content: '\00a0';
}

/* Cycling: bright gold flash while spinning */
.ma-flap.is-cycling[b-qrwzzzc6a3]::before,
.ma-flap.is-cycling[b-qrwzzzc6a3]::after {
    color: var(--board-amber);
    text-shadow: 0 0 14px var(--board-amber);
    animation: ma-cycle-b-qrwzzzc6a3 90ms linear infinite;
}

@keyframes ma-cycle-b-qrwzzzc6a3 {
    0%   { transform: rotateX(0deg); }
    50%  { transform: rotateX(180deg); }
    100% { transform: rotateX(360deg); }
}

/* ── Status badge — sits below the flap row in the column layout ── */
.ma-status-badge[b-qrwzzzc6a3] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    /* increase size for legibility */
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    padding: 4px 7px;
    border-radius: 2px;
    text-transform: uppercase;
    font-weight: 700;
    white-space: nowrap;
    align-self: center;
    /* Start invisible — JS adds .is-revealed after flicker settles,
       C# _badgesRevealed keeps it visible on subsequent re-renders */
    opacity: 0;
    transition: opacity 400ms ease;
}

.ma-status-badge.is-revealed[b-qrwzzzc6a3] {
    opacity: 1;
}

.ma-status-badge--ontime[b-qrwzzzc6a3] {
    background: rgba(22, 78, 65, 0.35);
    color: var(--theme-success-light);
    border: 1px solid var(--theme-success);
    box-shadow: 0 0 5px rgba(46,125,107,0.35);
}

.ma-status-badge--boarding[b-qrwzzzc6a3] {
    background: rgba(184,134,11,0.18);
    color: var(--board-amber);
    border: 1px solid var(--board-amber-dim);
    box-shadow: 0 0 5px rgba(184,134,11,0.28);
}

/* Boarding blink only runs once visible */
.ma-status-badge--boarding.is-revealed[b-qrwzzzc6a3] {
    animation: ma-blink-b-qrwzzzc6a3 1.4s ease-in-out infinite;
}

@keyframes ma-blink-b-qrwzzzc6a3 {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.4; }
}

/* ── Sub-panel (hover dropdown) ── */
.ma-col--has-sub[b-qrwzzzc6a3] {
    position: relative;
    overflow: visible;
}

.ma-sub-panel[b-qrwzzzc6a3] {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 1205;
    min-width: 260px;
    max-width: min(100vw - 2rem, 320px);
    box-sizing: border-box;
    background: var(--theme-dark-page-bg);
    border: 2px solid var(--board-frame);
    border-top: 3px solid var(--board-amber);
    box-shadow: 0 8px 32px rgba(0,0,0,0.85);
    /* Push content down visually without creating a hover gap */
    margin-top: 10px;
}

/* Invisible hover bridge fills the margin-top gap so the mouse
   doesn't exit the hover zone while travelling from bar to panel */
.ma-sub-panel[b-qrwzzzc6a3]::before {
    content: '';
    position: absolute;
    top: -12px;
    left: 0;
    right: 0;
    height: 12px;
}

.ma-col--has-sub:hover .ma-sub-panel[b-qrwzzzc6a3],
.ma-col--has-sub.is-open .ma-sub-panel[b-qrwzzzc6a3] {
    display: block;
}

/* Suppress hover-open briefly after a sub-row link is clicked */
.ma-col--has-sub.is-closed .ma-sub-panel[b-qrwzzzc6a3] {
    display: none !important;
}

.ma-sub-header[b-qrwzzzc6a3] {
    background: var(--board-frame);
    border-bottom: 1px solid var(--theme-dark-accent);
    padding: 10px 10px;
    line-height: 1;
}

.ma-sub-title[b-qrwzzzc6a3] {
    display: block;
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    color: rgba(255,255,255,0.65);
    text-transform: uppercase;
    line-height: 1;
    margin: 0;
}

.ma-sub-row[b-qrwzzzc6a3] {
    display: block;
    padding: 6px 10px 12px 6px;
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.82rem;
    line-height: 1.5;
    color: var(--board-amber);
    text-decoration: none;
    border-bottom: 1px solid var(--board-flap-line);
    transition: background 100ms, color 100ms;
}

    .ma-sub-row.indent[b-qrwzzzc6a3] {
        padding: 6px 10px 12px 16px;
    }

        .ma-sub-row--parent[b-qrwzzzc6a3] {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
            padding: 6px 10px 12px 6px;
            border-bottom: 1px solid var(--board-flap-line);
        }

        .ma-sub-row--parent .ma-sub-row-title[b-qrwzzzc6a3] {
            flex: 1;
            min-width: 0;
            display: flex;
            align-items: center;
            text-decoration: none;
            color: var(--board-amber);
        }

        .ma-sub-chevron-btn[b-qrwzzzc6a3] {
            background: transparent;
            border: none;
            color: var(--board-amber-dim);
            width: 30px;
            height: 30px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0;
            border-radius: 8px;
            cursor: pointer;
            transition: color 120ms ease, background 120ms ease;
        }

            .ma-sub-chevron-btn:hover[b-qrwzzzc6a3] {
                color: var(--board-amber);
                background: rgba(255,255,255,0.08);
            }

        .ma-sub-row:hover[b-qrwzzzc6a3],
        .ma-sub-row:focus-visible[b-qrwzzzc6a3] {
            background: rgba(184,134,11,0.12);
            color: var(--board-amber);
            outline: none;
        }

        .ma-sub-dest[b-qrwzzzc6a3] {
            letter-spacing: 0.06em;
            text-transform: uppercase;
            font-weight: 600;
            color: var(--theme-light-accent);
        }

        [data-bs-theme=dark] .ma-sub-dest[b-qrwzzzc6a3] {
            color: var(--theme-dark-accent);
        }
    /* ── Status lamps ── */
    .ma-board-lamps[b-qrwzzzc6a3] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 0 8px 0 14px;
        flex-shrink: 0;
    }

    .ma-status-lamp[b-qrwzzzc6a3] {
        display: inline-block;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        box-shadow: 0 0 6px currentColor;
    }

    .ma-status-lamp--amber[b-qrwzzzc6a3] {
        background: var(--board-amber);
        color: var(--board-amber);
    }

    .ma-status-lamp--green[b-qrwzzzc6a3] {
        background: var(--theme-success-light);
        color: var(--theme-success-light);
    }
    /* Clacks 2x3 matrix indicator */
    .ma-clacks[b-qrwzzzc6a3] {
        padding: 0 8px 0 14px;
        display: flex;
        align-items: center;
        gap: 4px;
    }

    .ma-clacks-grid[b-qrwzzzc6a3] {
        display: grid;
        grid-template-columns: repeat(2, 10px);
        grid-template-rows: repeat(3, 10px);
        gap: 2px;
    }

    .ma-clacks-light[b-qrwzzzc6a3] {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: rgba(255,255,255,0.12);
        box-shadow: inset 0 0 2px rgba(0,0,0,0.4);
        transition: background 120ms, box-shadow 120ms;
    }

        .ma-clacks-light.is-on[b-qrwzzzc6a3] {
            background: var(--board-amber);
            box-shadow: 0 0 5px var(--board-amber), inset 0 0 3px rgba(255,255,255,0.8);
        }

    .ma-clacks-grid.ma-clacks-alt .ma-clacks-light.is-on[b-qrwzzzc6a3] {
        background: var(--theme-success-light);
        box-shadow: 0 0 5px var(--theme-success-light), inset 0 0 3px rgba(255,255,255,0.8);
    }

    .ma-clacks-grid.ma-clacks-standard .ma-clacks-light.is-on[b-qrwzzzc6a3] {
        background: var(--board-amber);
        box-shadow: 0 0 5px var(--board-amber), inset 0 0 3px rgba(255,255,255,0.8);
    }

    .ma-clacks-message[b-qrwzzzc6a3] {
        margin-top: 0.2rem;
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 0.68rem;
        line-height: 1.2;
        color: var(--board-amber);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 250px;
    }

    .ma-clacks-message--alt[b-qrwzzzc6a3] {
        color: var(--theme-success-light);
    }
    /* ── Loading state ── */
    .ma-loading[b-qrwzzzc6a3] {
        display: flex;
        align-items: center;
        padding: 0 12px;
    }

    .ma-flap--loading[b-qrwzzzc6a3] {
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 0.82rem;
        color: var(--board-amber-dim);
        letter-spacing: 0.08em;
        animation: ma-blink-b-qrwzzzc6a3 1s ease-in-out infinite;
    }
    /* ── Utility bar ── */
    .ma-utility-bar[b-qrwzzzc6a3] {
        background: var(--theme-dark-page-bg);
        border-top: 1px solid var(--board-frame);
        min-height: 44px;
        align-items: center;
    }
        /* Ensure the search control fills available space on the right */
        .ma-utility-bar .ma-search[b-qrwzzzc6a3] {
            max-width: 100%;
            min-width: 0;
        }

    .ma-search-input[b-qrwzzzc6a3] {
        min-width: 0;
        width: 100%;
    }

    .ma-search-input[b-qrwzzzc6a3] {
        background: var(--board-flap) !important;
        border-color: var(--board-frame) !important;
        color: var(--board-amber) !important;
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 0.82rem;
    }

        .ma-search-input[b-qrwzzzc6a3]::placeholder {
            color: var(--board-amber-dim) !important;
        }

    .ma-search-btn[b-qrwzzzc6a3],
    .ma-user-btn[b-qrwzzzc6a3],
    .ma-basket-btn[b-qrwzzzc6a3],
    .ma-menu-toggle[b-qrwzzzc6a3],
    .notifications-dropdown-toggle[b-qrwzzzc6a3] {
        /* Use button token aliases from root so these buttons mirror .btn-primary
       across both light and dark themes. Set an explicit border so the
       unselected state is clearly delineated from the header background. */
        background-color: var(--bs-btn-bg) !important;
        border: 1px solid var(--bs-btn-border-color) !important;
        border-color: var(--bs-btn-border-color) !important;
        color: var(--bs-btn-color) !important;
        transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
    }

        .ma-search-btn:hover[b-qrwzzzc6a3],
        .ma-user-btn:hover[b-qrwzzzc6a3],
        .ma-basket-btn:hover[b-qrwzzzc6a3],
        .ma-menu-toggle:hover[b-qrwzzzc6a3],
        .notifications-dropdown-toggle:hover[b-qrwzzzc6a3],
        .ma-search-btn:focus-visible[b-qrwzzzc6a3],
        .ma-user-btn:focus-visible[b-qrwzzzc6a3],
        .ma-basket-btn:focus-visible[b-qrwzzzc6a3],
        .ma-menu-toggle:focus-visible[b-qrwzzzc6a3],
        .notifications-dropdown-toggle:focus-visible[b-qrwzzzc6a3] {
            background: var(--bs-btn-hover-bg) !important;
            border-color: var(--bs-btn-hover-border-color) !important;
            color: var(--bs-btn-hover-color) !important;
        }

    .ma-utility-bar > .dropdown[b-qrwzzzc6a3] {
        align-self: center;
        display: flex;
        align-items: center;
    }

    .ma-basket-btn[b-qrwzzzc6a3],
    .ma-menu-toggle[b-qrwzzzc6a3],
    .notifications-dropdown-toggle[b-qrwzzzc6a3] {
        /* Use the shared button tokens for background and border so the
       icon buttons align with other nav controls. Keep typography and
       sizing local to this group. */
        background-color: var(--bs-btn-bg);
        border: 1px solid var(--bs-btn-border-color);
        color: var(--bs-btn-color);
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 0.78rem;
        letter-spacing: 0.05em;
        height: 30px;
        padding-top: 0;
        padding-bottom: 0;
        line-height: 1;
        align-self: center;
        transition: background-color 120ms, color 120ms, border-color 120ms;
    }
    /* Make the login button visually match the primary buttons used elsewhere */
    .ma-user-btn[b-qrwzzzc6a3] {
        /* Use the board amber (yellow) so the login button appears as a
       yellow action button. Text color uses the page background token to
       maintain contrast in dark mode. Theme-specific overrides below
       handle light-mode colour swaps. */
        background: var(--board-amber);
        border-color: var(--board-amber);
        color: var(--theme-dark-page-bg);
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 0.78rem;
        letter-spacing: 0.05em;
        height: 30px;
        padding-top: 0;
        padding-bottom: 0;
        line-height: 1;
        align-self: center;
        transition: background 120ms, color 120ms, border-color 120ms;
    }

    .ma-user-btn[b-qrwzzzc6a3] {
        display: inline-flex;
        align-items: center;
        min-width: 0;
        max-width: 100%;
    }

    .ma-user-btn-text[b-qrwzzzc6a3] {
        display: inline-block;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 20ch;
    }

    .ma-basket-btn:hover[b-qrwzzzc6a3],
    .ma-menu-toggle:hover[b-qrwzzzc6a3],
    .notifications-dropdown-toggle:hover[b-qrwzzzc6a3] {
        /* follow the amber action hover used by the login/search buttons */
        background: var(--board-amber-dim);
        color: var(--theme-dark-page-bg);
        border-color: var(--board-amber-dim);
    }
    /* focus visible states for accessibility */
    .ma-basket-btn:focus-visible[b-qrwzzzc6a3],
    .ma-menu-toggle:focus-visible[b-qrwzzzc6a3],
    .notifications-dropdown-toggle:focus-visible[b-qrwzzzc6a3] {
        background: var(--board-amber-dim);
        color: var(--theme-dark-page-bg);
        border-color: var(--board-amber-dim);
    }
    /* Hover for amber login button: use the dim amber token so hover stays
   within the amber palette rather than switching to the brown chrome. */
    .ma-user-btn:hover[b-qrwzzzc6a3] {
        background: var(--board-amber-dim);
        color: var(--theme-dark-page-bg);
        border-color: var(--board-amber-dim);
    }

    [data-bs-theme=light] .ma-basket-btn:hover[b-qrwzzzc6a3],
    [data-bs-theme=light] .ma-menu-toggle:hover[b-qrwzzzc6a3],
    [data-bs-theme=light] .notifications-dropdown-toggle:hover[b-qrwzzzc6a3] {
        background: var(--board-amber-dim);
        color: var(--theme-light-menu-bg);
        border-color: var(--board-amber-dim);
    }

    [data-bs-theme=light] .ma-basket-btn:focus-visible[b-qrwzzzc6a3],
    [data-bs-theme=light] .ma-menu-toggle:focus-visible[b-qrwzzzc6a3],
    [data-bs-theme=light] .notifications-dropdown-toggle:focus-visible[b-qrwzzzc6a3] {
        background: var(--board-amber-dim);
        color: var(--theme-light-menu-bg);
        border-color: var(--board-amber-dim);
    }
    /* NAV button appearance is controlled by the variable-based rules
   earlier in this file (they read the --bs-btn-* aliases defined in
   app.css). Removing duplicate/conflicting rules so those tokens win. */
    /* Light-mode override: use the light accent token so the button remains
   legible on a parchment/light header background */
    [data-bs-theme=light] .ma-user-btn[b-qrwzzzc6a3] {
        /* use the amber action colour in light mode too (keeps the button
       yellow rather than the parchment/brown accent) */
        background: var(--board-amber);
        border-color: var(--board-amber);
        color: var(--theme-light-menu-bg);
    }

        [data-bs-theme=light] .ma-user-btn:hover[b-qrwzzzc6a3] {
            /* hover stays within amber palette for consistency */
            background: var(--board-amber-dim);
            color: var(--theme-light-menu-bg);
            border-color: var(--board-amber-dim);
        }

    .ma-dropdown[b-qrwzzzc6a3] {
        background: var(--theme-dark-page-bg);
        border: 2px solid var(--board-frame);
        min-width: 280px;
        max-width: min(100vw - 1rem, 320px);
    }

    .ma-user-menu-action[b-qrwzzzc6a3] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 2.25rem;
        padding: 0.375rem 0.75rem;
        font-family: 'Share Tech Mono', monospace;
        font-size: 0.78rem;
        line-height: 1.2;
        text-align: center;
        white-space: normal;
    }

    .ma-dropdown-item[b-qrwzzzc6a3] {
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 0.78rem;
        color: var(--board-amber);
        letter-spacing: 0.03em;
    }

        .ma-dropdown-item:hover[b-qrwzzzc6a3],
        .ma-dropdown-item:focus[b-qrwzzzc6a3] {
            background: rgba(184,134,11,0.14);
            color: var(--board-amber);
        }

    .ma-divider[b-qrwzzzc6a3] {
        border-color: var(--board-frame);
    }

    .ma-badge[b-qrwzzzc6a3] {
        background: var(--theme-dark-btn-bg);
        color: var(--theme-dark-page-bg);
        font-family: 'Share Tech Mono', monospace;
        font-size: 0.58rem;
    }

    .ma-btn-primary[b-qrwzzzc6a3] {
        background: var(--board-frame);
        border-color: var(--board-frame);
        color: var(--theme-dark-text);
        font-family: 'Share Tech Mono', monospace;
        font-size: 0.78rem;
    }

        .ma-btn-primary:hover[b-qrwzzzc6a3] {
            background: var(--theme-dark-btn-bg);
            color: var(--theme-dark-page-bg);
        }

    .ma-btn-secondary[b-qrwzzzc6a3] {
        background: var(--theme-dark-dropdown-hover-bg);
        border-color: var(--board-frame);
        color: var(--board-amber);
        font-family: 'Share Tech Mono', monospace;
        font-size: 0.78rem;
    }

        .ma-btn-secondary:hover[b-qrwzzzc6a3] {
            background: var(--theme-dark-page-bg);
            color: var(--board-amber);
        }
    /* ── Mobile off-canvas ── */
    .ma-mobile-offcanvas[b-qrwzzzc6a3] {
        background: var(--theme-dark-page-bg);
        border-bottom: 3px solid var(--board-frame);
        height: 100dvh !important;
        max-width: 100vw;
        box-sizing: border-box;
        overflow: visible; /* allow header children (close button) to escape clipping */
    }
    /* Light-mode mobile offcanvas should use the light menu background to avoid a jarring black panel */
    [data-bs-theme=light] .ma-mobile-offcanvas[b-qrwzzzc6a3] {
        background: var(--theme-light-page-bg) !important;
        border-bottom-color: var(--theme-light-accent) !important;
    }

    .ma-offcanvas-header[b-qrwzzzc6a3] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: var(--theme-dark-btn-bg);
        border-bottom: 2px solid var(--theme-dark-accent);
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 0.95rem;
        letter-spacing: 0.1em;
        color: #000;
        text-shadow: none;
        padding: 0.75rem 0.75rem; /* ensure enough vertical space for controls */
        box-sizing: border-box;
        overflow: visible; /* allow child borders/shadows to render */
        position: relative;
        z-index: 1;
        min-height: 56px; /* keep header tall enough so button sits fully inside */
    }

    .ma-close-btn[b-qrwzzzc6a3] {
        background: transparent;
        border: 1px solid var(--board-frame);
        color: #000;
        line-height: 1.5rem !important;
        font-size: 1rem;
    }

        .ma-close-btn:hover[b-qrwzzzc6a3] {
            background: rgba(0,0,0,0.08);
            color: #000;
        }

    [data-bs-theme=dark] .ma-close-btn[b-qrwzzzc6a3] {
        color: #000;
        border-color: rgba(0,0,0,0.35);
    }

        [data-bs-theme=dark] .ma-close-btn:hover[b-qrwzzzc6a3] {
            background: rgba(0,0,0,0.08);
            color: #000;
        }


    .ma-offcanvas-body[b-qrwzzzc6a3] {
        overflow-y: auto;
        position: relative; /* preserve local positioning for scrolling content */
        padding-bottom: calc(120px + env(safe-area-inset-bottom, 0)) !important; /* reserve extra space for the fixed bottom theme row */
    }

    .ma-mobile-row[b-qrwzzzc6a3] {
        display: block;
        padding: 12px 20px;
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 0.88rem;
        letter-spacing: 0.07em;
        text-decoration: none;
        text-transform: uppercase;
        border-bottom: 1px solid var(--board-flap-line);
        transition: background 100ms, color 100ms;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

        .ma-mobile-row:hover[b-qrwzzzc6a3],
        .ma-mobile-row:focus-visible[b-qrwzzzc6a3] {
            background: rgba(184,134,11,0.12);
            color: var(--board-amber);
            outline: none;
        }
    /* Parent row that contains a chevron toggle */
    .ma-mobile-row--parent[b-qrwzzzc6a3] {
        cursor: pointer;
        padding: 12px 20px;
        border-bottom: 1px solid var(--board-flap-line);
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        min-height: 50px;
        box-sizing: border-box;
    }

        .ma-mobile-row--parent:hover[b-qrwzzzc6a3],
        .ma-mobile-row--parent:focus-visible[b-qrwzzzc6a3] {
            background: rgba(184,134,11,0.12);
            outline: none;
        }

        .ma-mobile-row--parent .ma-mobile-row-title[b-qrwzzzc6a3] {
            font-family: 'Share Tech Mono', 'Courier New', monospace;
            font-size: 0.88rem;
            letter-spacing: 0.1em;
            text-decoration: none;
            text-transform: uppercase;
            flex: 1;
            min-width: 0;
            overflow-wrap: anywhere;
            word-break: break-word;
            display: block;
            padding-right: 0.75rem;
            color: var(--board-amber);
        }

            .ma-mobile-row--parent .ma-mobile-row-title:hover[b-qrwzzzc6a3] {
                color: var(--board-amber);
            }

    .ma-mobile-chevron[b-qrwzzzc6a3] {
        color: var(--board-amber-dim);
        font-size: 0.9rem;
        transition: transform 200ms ease, color 120ms ease;
        flex-shrink: 0;
    }

    .ma-mobile-chevron-btn[aria-expanded="true"] .ma-mobile-chevron[b-qrwzzzc6a3] {
        transform: rotate(180deg);
    }

    .ma-mobile-chevron-btn[b-qrwzzzc6a3] {
        background: none;
        border: none;
        border-radius: 8px;
        padding: 0;
        width: 32px;
        height: 32px;
        color: var(--board-amber-dim);
        cursor: pointer;
        flex-shrink: 0;
        line-height: 1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        transition: transform 200ms ease, color 120ms ease, background 120ms ease, border-color 120ms ease;
    }

        .ma-mobile-chevron-btn:hover[b-qrwzzzc6a3] {
            color: var(--board-amber);
            background: rgba(255,255,255,0.14);
            border-color: rgba(255,255,255,0.24);
        }

    .ma-mobile-sub-list[b-qrwzzzc6a3] {
        margin-left: 20px;
        min-width: 0;
    }

    .ma-mobile-row--sub[b-qrwzzzc6a3] {
        font-size: 0.78rem;
        color: var(--board-amber-dim);
        padding: 12px 20px 12px 36px;
        letter-spacing: 0.08em;
    }

    .ma-mobile-row--parent.ma-mobile-row--sub[b-qrwzzzc6a3] {
        padding-left: 12px;
    }

        .ma-mobile-row--parent.ma-mobile-row--sub .ma-mobile-row-title[b-qrwzzzc6a3] {
            font-size: 0.78rem;
            color: var(--board-amber-dim);
        }

        .ma-mobile-row--parent.ma-mobile-row--sub .ma-mobile-chevron[b-qrwzzzc6a3] {
            font-size: 0.75rem;
        }
    /* ── Responsive ── */
    @media (max-width: 991.98px) {
        .ma-board[b-qrwzzzc6a3] {
            display: none !important;
        }

        .ma-mobile-nameplate[b-qrwzzzc6a3] {
            display: inline-flex;
            margin-right: auto;
        }

        .ma-utility-bar[b-qrwzzzc6a3] {
            flex-wrap: wrap;
            width: 100%;
            min-height: 56px;
            padding-top: 0.35rem;
            padding-bottom: 0.35rem;
            padding-left: 0.75rem !important;
            padding-right: 0.75rem !important;
            gap: 0.5rem !important;
            justify-content: flex-start;
        }

            .ma-utility-bar > .flex-grow-1[b-qrwzzzc6a3] {
                flex-basis: 100%;
                order: 10;
                min-width: 0;
            }

            .ma-utility-bar > .dropdown[b-qrwzzzc6a3],
            .ma-menu-toggle[b-qrwzzzc6a3],
            .ma-basket-btn[b-qrwzzzc6a3],
            .notifications-dropdown-toggle[b-qrwzzzc6a3] {
                flex-shrink: 0;
            }
        /* Ensure the mobile menu toggle visually matches other utility buttons */
        html:not(.text-only) .ma-utility-bar .ma-menu-toggle[b-qrwzzzc6a3],
        html:not(.text-only) .ma-utility-bar .ma-menu-toggle.btn[b-qrwzzzc6a3],
        html:not(.text-only) .ma-utility-bar .ma-menu-toggle.btn-sm[b-qrwzzzc6a3] {
            background-color: var(--board-amber) !important;
            border: 1px solid var(--board-amber) !important;
            color: var(--theme-dark-page-bg) !important;
            height: 30px;
            padding-left: 0.5rem;
            padding-right: 0.5rem;
            line-height: 1;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

            html:not(.text-only) .ma-utility-bar .ma-menu-toggle:hover[b-qrwzzzc6a3],
            html:not(.text-only) .ma-utility-bar .ma-menu-toggle:focus-visible[b-qrwzzzc6a3] {
                background-color: var(--board-amber-dim) !important;
                border-color: var(--board-amber-dim) !important;
                color: var(--theme-dark-page-bg) !important;
            }

        .ma-user-btn-text[b-qrwzzzc6a3] {
            max-width: min(24vw, 11ch);
        }

        .ma-dropdown[b-qrwzzzc6a3] {
            max-width: min(100vw - 1rem, 22rem);
        }
    }

    @media (max-width: 576px) {
        .ma-mobile-nameplate-logo[b-qrwzzzc6a3] {
            height: 44px;
        }

        .ma-user-btn[b-qrwzzzc6a3],
        .ma-basket-btn[b-qrwzzzc6a3],
        .ma-menu-toggle[b-qrwzzzc6a3],
        .notifications-dropdown-toggle[b-qrwzzzc6a3] {
            padding-left: 0.45rem;
            padding-right: 0.45rem;
        }
    }
    /* ── lg tier (992–1199px): aggressive compression ── */
    @media (min-width: 992px) and (max-width: 1199.98px) {
        .ma-nameplate[b-qrwzzzc6a3] {
            padding: 0 8px 0 2px;
        }

        .ma-clock[b-qrwzzzc6a3] {
            display: none;
        }

        .ma-board-divider[b-qrwzzzc6a3] {
            margin: 0 4px;
        }

        .ma-col-link[b-qrwzzzc6a3] {
            padding: 4px 4px;
            gap: 3px;
            overflow: hidden;
        }

        .ma-col-flaps[b-qrwzzzc6a3] {
            overflow: hidden;
            flex-shrink: 1;
        }

        .ma-flap[b-qrwzzzc6a3] {
            width: 11px;
            height: 32px;
        }

            .ma-flap[b-qrwzzzc6a3]::before {
                font-size: 16px;
                line-height: 32px;
                height: 16px;
            }

            .ma-flap[b-qrwzzzc6a3]::after {
                font-size: 16px;
                line-height: 32px;
                height: 32px;
                margin-top: -16px;
            }

        .ma-status-badge[b-qrwzzzc6a3] {
            /* lg: slightly smaller than desktop but still readable */
            font-size: 0.46rem;
            padding: 2px 4px;
            letter-spacing: 0.04em;
        }

        .ma-board[b-qrwzzzc6a3] {
            min-height: 50px;
        }

        .ma-board-lamps[b-qrwzzzc6a3] {
            display: none;
        }
    }
    /* ── xl tier (1200–1649px): mild compression ── */
    @media (min-width: 1200px) and (max-width: 1649.98px) {
        .ma-nameplate[b-qrwzzzc6a3] {
            padding: 0 10px 0 4px;
        }

        .ma-clock[b-qrwzzzc6a3] {
            font-size: 0.72rem;
        }

        .ma-board-divider[b-qrwzzzc6a3] {
            margin: 0 6px;
        }

        .ma-col-link[b-qrwzzzc6a3] {
            padding: 6px 6px;
            gap: 4px;
            overflow: hidden;
        }

        .ma-col-flaps[b-qrwzzzc6a3] {
            overflow: hidden;
            flex-shrink: 1;
        }

        .ma-flap[b-qrwzzzc6a3] {
            width: 15px;
            height: 38px;
        }

            .ma-flap[b-qrwzzzc6a3]::before {
                font-size: 20px;
                line-height: 38px;
                height: 19px;
            }

            .ma-flap[b-qrwzzzc6a3]::after {
                font-size: 20px;
                line-height: 38px;
                height: 38px;
                margin-top: -19px;
            }

        .ma-status-badge[b-qrwzzzc6a3] {
            /* xl: medium size between lg and desktop */
            font-size: 0.52rem;
            padding: 3px 5px;
            letter-spacing: 0.05em;
        }

        .ma-board[b-qrwzzzc6a3] {
            min-height: 60px;
        }
    }
    /* ── Reduce motion ── */
    @media (prefers-reduced-motion: reduce) {
        .ma-flap.is-cycling[b-qrwzzzc6a3]::before,
        .ma-flap.is-cycling[b-qrwzzzc6a3]::after,
        .ma-status-badge--boarding[b-qrwzzzc6a3],
        .ma-flap--loading[b-qrwzzzc6a3] {
            animation: none !important;
        }
    }
    /* =================================================================
   BOOTSTRAP LIGHT MODE OVERRIDES
   In light mode the board chrome shifts to warm parchment/leather
   tones. The dark flap cells themselves stay black — they are the
   airline board and are always intentionally dark.
   ================================================================= */
    [data-bs-theme=light] .ma-header[b-qrwzzzc6a3] {
        background: var(--theme-light-menu-bg);
        border-bottom-color: var(--theme-light-accent);
        box-shadow: 0 4px 20px rgba(0,0,0,0.18);
    }

    [data-bs-theme=light] .ma-board[b-qrwzzzc6a3] {
        background: var(--theme-light-menu-bg);
        border-bottom-color: var(--theme-light-accent);
    }
    /* In light mode the nav strip blends into the parchment header — no dark panel */
    [data-bs-theme=light] .ma-cols[b-qrwzzzc6a3] {
        background: transparent;
        border-color: transparent;
    }

    [data-bs-theme=light] .ma-col[b-qrwzzzc6a3] {
        border-right-color: transparent;
    }
    /* Flap cells sit on the menu header — single card colour with a subtle crease line */
    [data-bs-theme=light] .ma-flap[b-qrwzzzc6a3] {
        background: var(--theme-light-menu-bg);
        border-right-color: rgba(120,82,10,0.12);
    }

        [data-bs-theme=light] .ma-flap[b-qrwzzzc6a3]::before {
            background: var(--theme-light-menu-bg);
            border-bottom-color: rgba(120,82,10,0.25);
            color: var(--theme-light-accent);
            text-shadow: none;
        }

        [data-bs-theme=light] .ma-flap[b-qrwzzzc6a3]::after {
            background: var(--theme-light-menu-bg);
            color: var(--theme-light-accent);
            text-shadow: none;
            opacity: 0.55;
        }

        [data-bs-theme=light] .ma-flap.is-cycling[b-qrwzzzc6a3]::before,
        [data-bs-theme=light] .ma-flap.is-cycling[b-qrwzzzc6a3]::after {
            color: var(--theme-light-accent);
            text-shadow: none;
        }

    [data-bs-theme=light] .ma-col-link:hover[b-qrwzzzc6a3],
    [data-bs-theme=light] .ma-col-link:focus-visible[b-qrwzzzc6a3] {
        background: rgba(120, 82, 10, 0.07);
    }

    [data-bs-theme=light] .ma-utility-bar[b-qrwzzzc6a3] {
        background: var(--theme-light-menu-bg);
        border-top-color: var(--theme-light-accent);
    }

    [data-bs-theme=light] .ma-board-divider[b-qrwzzzc6a3] {
        background: var(--theme-light-accent);
    }
    /* Badges need opaque enough backgrounds to stay legible on parchment header */
    [data-bs-theme=light] .ma-status-badge--boarding[b-qrwzzzc6a3] {
        background: rgba(120, 82, 10, 0.15);
        color: var(--theme-light-accent);
        border-color: var(--theme-light-accent);
        box-shadow: 0 0 5px rgba(120,82,10,0.25);
    }

    [data-bs-theme=light] .ma-status-badge--ontime[b-qrwzzzc6a3] {
        background: rgba(22, 78, 65, 0.12);
        color: var(--theme-success);
        border-color: var(--theme-success);
        box-shadow: 0 0 4px rgba(46,125,107,0.2);
    }

    [data-bs-theme=light] .ma-clock[b-qrwzzzc6a3] {
        text-shadow: none;
        color: var(--theme-light-accent);
    }

    [data-bs-theme=light] .ma-search-input[b-qrwzzzc6a3] {
        background: var(--theme-light-menu-bg) !important;
        border-color: var(--theme-light-accent) !important;
        color: var(--theme-light-accent) !important;
    }

        [data-bs-theme=light] .ma-search-input[b-qrwzzzc6a3]::placeholder {
            color: var(--theme-light-accent) !important;
            opacity: 0.6;
        }

    [data-bs-theme=light] .ma-search-btn[b-qrwzzzc6a3] {
        background: var(--theme-light-accent);
        border-color: var(--theme-light-accent);
        color: var(--theme-light-menu-bg);
    }

        [data-bs-theme=light] .ma-search-btn:hover[b-qrwzzzc6a3] {
            /* Use the amber action hover in light mode so the search control
       matches other action buttons (login) rather than the parchment
       accent. Also ensure keyboard focus uses the same contrast. */
            background: var(--board-amber-dim);
            color: var(--theme-light-menu-bg);
        }

        [data-bs-theme=light] .ma-search-btn:focus-visible[b-qrwzzzc6a3] {
            background: var(--board-amber-dim);
            color: var(--theme-light-menu-bg);
        }

    [data-bs-theme=light] .ma-user-btn[b-qrwzzzc6a3],
    [data-bs-theme=light] .ma-basket-btn[b-qrwzzzc6a3],
    [data-bs-theme=light] .ma-menu-toggle[b-qrwzzzc6a3] {
        border-color: var(--theme-light-accent);
        color: var(--theme-light-accent);
    }

        [data-bs-theme=light] .ma-user-btn:hover[b-qrwzzzc6a3],
        [data-bs-theme=light] .ma-basket-btn:hover[b-qrwzzzc6a3],
        [data-bs-theme=light] .ma-menu-toggle:hover[b-qrwzzzc6a3] {
            background: var(--theme-light-accent);
            color: var(--theme-light-menu-bg);
            border-color: var(--theme-dark-btn-bg);
        }

    [data-bs-theme=light] .ma-sub-panel[b-qrwzzzc6a3] {
        background: var(--theme-light-dropdown-bg);
        border-color: var(--theme-light-accent);
        border-top-color: var(--theme-light-accent);
        box-shadow: 0 8px 32px rgba(0,0,0,0.25);
    }

    [data-bs-theme=light] .ma-sub-header[b-qrwzzzc6a3] {
        background: var(--theme-light-accent);
        border-bottom-color: var(--theme-light-accent);
    }

    [data-bs-theme=light] .ma-sub-title[b-qrwzzzc6a3] {
        color: var(--theme-light-menu-bg);
    }

    [data-bs-theme=light] .ma-sub-row[b-qrwzzzc6a3] {
        color: var(--theme-light-accent);
        border-bottom-color: rgba(120,82,10,0.15);
    }

        [data-bs-theme=light] .ma-sub-row:hover[b-qrwzzzc6a3],
        [data-bs-theme=light] .ma-sub-row:focus-visible[b-qrwzzzc6a3] {
            background: var(--theme-light-dropdown-hover-bg);
            color: var(--theme-light-accent);
        }

    [data-bs-theme=light] .ma-dropdown[b-qrwzzzc6a3] {
        background: var(--theme-light-dropdown-bg);
        border-color: var(--theme-light-accent);
    }

    [data-bs-theme=light] .ma-offcanvas-header[b-qrwzzzc6a3] {
        background: var(--theme-light-accent);
        border-bottom-color: var(--theme-light-accent);
        color: #fff;
        text-shadow: none;
    }

    [data-bs-theme=light] .ma-close-btn[b-qrwzzzc6a3] {
        color: #fff;
        border-color: rgba(255,255,255,0.65);
    }

        [data-bs-theme=light] .ma-close-btn:hover[b-qrwzzzc6a3] {
            background: rgba(255,255,255,0.12);
            color: #fff;
        }

    [data-bs-theme=light] .ma-dropdown-item[b-qrwzzzc6a3] {
        color: var(--theme-light-accent);
    }

        [data-bs-theme=light] .ma-dropdown-item:hover[b-qrwzzzc6a3],
        [data-bs-theme=light] .ma-dropdown-item:focus[b-qrwzzzc6a3] {
            background: var(--theme-light-dropdown-hover-bg);
            color: var(--theme-light-accent);
        }
    /* =================================================================
   DARK MODE OVERRIDES
   The board chrome (header, board, cols) is already --board-bg (black).
   Explicitly wire dropdowns and sub-panels to the dark theme palette.
   ================================================================= */
    [data-bs-theme=dark] .ma-sub-panel[b-qrwzzzc6a3] {
        background: var(--theme-dark-dropdown-bg);
        border-color: var(--theme-dark-accent);
        border-top-color: var(--theme-dark-accent);
        box-shadow: 0 8px 32px rgba(0,0,0,0.85);
    }

    [data-bs-theme=dark] .ma-sub-header[b-qrwzzzc6a3] {
        background: var(--theme-dark-btn-bg);
        border-bottom-color: rgba(242,194,75,0.3);
    }

    [data-bs-theme=dark] .ma-sub-title[b-qrwzzzc6a3] {
        color: #000;
    }
    /* =================================================================
   TEXT-ONLY OVERRIDES
   ================================================================= */
    .text-only .ma-header[b-qrwzzzc6a3],
    .text-only .ma-utility-bar[b-qrwzzzc6a3] {
        background: var(--bs-body-bg) !important;
        background-color: var(--bs-body-bg) !important;
        border-color: var(--bs-border-color) !important;
        box-shadow: none !important;
    }
        /* Override ALL amber button colors in text-only mode — covers every
           rule inside this @media block that sets amber without a guard */
        .text-only .ma-utility-bar .ma-search-btn[b-qrwzzzc6a3],
        .text-only .ma-utility-bar .ma-basket-btn[b-qrwzzzc6a3],
        .text-only .ma-utility-bar .ma-user-btn[b-qrwzzzc6a3],
        .text-only .ma-utility-bar .ma-menu-toggle[b-qrwzzzc6a3],
        .text-only .ma-utility-bar .notifications-dropdown-toggle[b-qrwzzzc6a3] {
            background: transparent !important;
            background-color: transparent !important;
            border: 1px solid var(--bs-border-color) !important;
            color: var(--bs-body-color) !important;
            box-shadow: none !important;
            text-shadow: none !important;
            font-family: var(--bs-font-sans-serif) !important;
            letter-spacing: normal !important;
            font-weight: 400 !important;
        }

            .text-only .ma-utility-bar .ma-search-btn:hover[b-qrwzzzc6a3],
            .text-only .ma-utility-bar .ma-basket-btn:hover[b-qrwzzzc6a3],
            .text-only .ma-utility-bar .ma-user-btn:hover[b-qrwzzzc6a3],
            .text-only .ma-utility-bar .ma-menu-toggle:hover[b-qrwzzzc6a3],
            .text-only .ma-utility-bar .notifications-dropdown-toggle:hover[b-qrwzzzc6a3],
            .text-only .ma-utility-bar .ma-search-btn:focus-visible[b-qrwzzzc6a3],
            .text-only .ma-utility-bar .ma-basket-btn:focus-visible[b-qrwzzzc6a3],
            .text-only .ma-utility-bar .ma-user-btn:focus-visible[b-qrwzzzc6a3],
            .text-only .ma-utility-bar .ma-menu-toggle:focus-visible[b-qrwzzzc6a3],
            .text-only .ma-utility-bar .notifications-dropdown-toggle:focus-visible[b-qrwzzzc6a3] {
                background: var(--bs-secondary-bg) !important;
                background-color: var(--bs-secondary-bg) !important;
                border-color: var(--bs-border-color) !important;
                color: var(--bs-body-color) !important;
            }

        .text-only .ma-header[b-qrwzzzc6a3]::before {
            content: "";
            position: absolute;
            inset: 0;
            background: var(--bs-body-bg);
            z-index: -1;
        }

    .text-only .ma-board[b-qrwzzzc6a3] {
        background: var(--bs-body-bg) !important;
        border-bottom-color: var(--bs-border-color) !important;
    }

    .text-only .ma-search-input[b-qrwzzzc6a3],
    .text-only .ma-search-btn[b-qrwzzzc6a3],
    .text-only .ma-user-btn[b-qrwzzzc6a3],
    .text-only .ma-basket-btn[b-qrwzzzc6a3],
    .text-only .ma-menu-toggle[b-qrwzzzc6a3],
    .text-only .notifications-dropdown-toggle[b-qrwzzzc6a3] {
        background: var(--bs-body-bg) !important;
        border-color: var(--bs-border-color) !important;
        color: var(--bs-body-color) !important;
    }

    [data-bs-theme=dark] .ma-sub-row[b-qrwzzzc6a3] {
        color: var(--theme-dark-accent);
        border-bottom-color: rgba(242,194,75,0.15);
    }

        [data-bs-theme=dark] .ma-sub-row:hover[b-qrwzzzc6a3],
        [data-bs-theme=dark] .ma-sub-row:focus-visible[b-qrwzzzc6a3] {
            background: var(--theme-dark-dropdown-hover-bg);
            color: var(--theme-dark-accent);
            outline: none;
        }

    [data-bs-theme=dark] .ma-mobile-row-title[b-qrwzzzc6a3] {
        color: var(--theme-dark-accent);
    }

    [data-bs-theme=dark] .ma-clock[b-qrwzzzc6a3] {
        color: var(--theme-dark-accent);
    }
    /* =================================================================
   TEXT-ONLY MODE
   Strips all split-flap aesthetics — plain header with standard
   Bootstrap nav links. Animations and pseudo-element effects removed.
   ================================================================= */
    .text-only .ma-header[b-qrwzzzc6a3] {
        background: var(--bs-body-bg) !important;
        background-color: var(--bs-body-bg) !important;
        border-bottom: 1px solid var(--bs-border-color) !important;
        box-shadow: none !important;
    }

    .text-only .ma-board[b-qrwzzzc6a3] {
        background: var(--bs-body-bg) !important;
        border-bottom: none;
        min-height: 48px;
    }

    .text-only .ma-board-divider[b-qrwzzzc6a3] {
        display: none;
    }

    .text-only .ma-clock[b-qrwzzzc6a3] {
        font-family: var(--bs-font-sans-serif);
        color: var(--bs-secondary-color);
        text-shadow: none;
        letter-spacing: 0;
    }
    /* Replace flap cells with plain text */
    .text-only .ma-flap[b-qrwzzzc6a3] {
        background: transparent;
        border: none;
        color: var(--bs-body-color);
        height: auto;
        width: auto;
    }

        .text-only .ma-flap[b-qrwzzzc6a3]::before {
            display: none;
        }

        .text-only .ma-flap[b-qrwzzzc6a3]::after {
            display: none;
        }
    /* Show destination text via the data-dest attribute on the flap group */
    .text-only .ma-col-flaps[b-qrwzzzc6a3] {
        font-family: var(--bs-font-sans-serif);
        font-size: 1.5rem;
        color: var(--bs-nav-link-color, var(--bs-body-color));
        letter-spacing: 0;
        text-transform: capitalize;
    }

        .text-only .ma-col-flaps[b-qrwzzzc6a3]::after {
            content: attr(data-dest);
            font-family: var(--bs-font-sans-serif);
            font-size: 1.5rem;
            color: var(--bs-body-color);
            text-transform: capitalize;
            letter-spacing: 0;
        }
        /* Hide individual flap spans — the ::after on .ma-col-flaps shows the word */
        .text-only .ma-col-flaps .ma-flap[b-qrwzzzc6a3] {
            display: none;
        }

    .text-only .ma-col-link[b-qrwzzzc6a3] {
        padding: 6px 8px;
        transition: none;
    }

        .text-only .ma-col-link:hover[b-qrwzzzc6a3],
        .text-only .ma-col-link:focus-visible[b-qrwzzzc6a3] {
            background: var(--bs-secondary-bg);
        }
    /* Hide status badges in text-only mode */
    .text-only .ma-status-badge[b-qrwzzzc6a3] {
        display: none;
    }
    /* Hide board chrome */
    .text-only .ma-board-lamps[b-qrwzzzc6a3] {
        display: none;
    }
    /* Plain utility bar */
    .text-only .ma-utility-bar[b-qrwzzzc6a3] {
        background: var(--bs-card-cap-bg);
        border-top: 1px solid var(--bs-border-color);
        position: relative;
        z-index: 1;
    }

    .text-only .ma-search-input[b-qrwzzzc6a3] {
        background: var(--bs-body-bg) !important;
        border-color: var(--bs-border-color) !important;
        color: var(--bs-body-color) !important;
        font-family: var(--bs-font-sans-serif);
    }

        .text-only .ma-search-input[b-qrwzzzc6a3]::placeholder {
            color: var(--bs-secondary-color) !important;
        }

    .text-only .ma-search-btn[b-qrwzzzc6a3],
    .text-only .ma-user-btn[b-qrwzzzc6a3],
    .text-only .ma-basket-btn[b-qrwzzzc6a3],
    .text-only .ma-menu-toggle[b-qrwzzzc6a3] {
        background: transparent;
        border-color: var(--bs-border-color);
        color: var(--bs-body-color);
        font-family: var(--bs-font-sans-serif);
        transition: none;
    }

        .text-only .ma-search-btn:hover[b-qrwzzzc6a3],
        .text-only .ma-user-btn:hover[b-qrwzzzc6a3],
        .text-only .ma-basket-btn:hover[b-qrwzzzc6a3],
        .text-only .ma-menu-toggle:hover[b-qrwzzzc6a3] {
            background: var(--bs-secondary-bg);
            color: var(--bs-body-color);
            border-color: var(--bs-border-color);
        }
    /* Plain sub-panel in text-only mode */
    .text-only .ma-sub-panel[b-qrwzzzc6a3] {
        background: var(--bs-body-bg);
        border: 1px solid var(--bs-border-color);
        border-top: 2px solid var(--bs-border-color);
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }

    .text-only .ma-sub-header[b-qrwzzzc6a3] {
        background: var(--bs-secondary-bg);
        border-bottom-color: var(--bs-border-color);
    }

    .text-only .ma-sub-title[b-qrwzzzc6a3] {
        font-family: var(--bs-font-sans-serif);
        color: var(--bs-secondary-color);
    }

    .text-only .ma-sub-row[b-qrwzzzc6a3] {
        font-family: var(--bs-font-sans-serif);
        color: var(--bs-body-color);
        border-bottom-color: var(--bs-border-color);
        transition: none;
        text-transform: none;
    }

    .text-only .ma-sub-row--parent[b-qrwzzzc6a3] {
        background: transparent;
        text-transform: none;
    }

        .text-only .ma-sub-row--parent .ma-sub-row-title[b-qrwzzzc6a3] {
            color: var(--bs-body-color);
            text-transform: none;
        }

    .text-only .ma-sub-chevron-btn[b-qrwzzzc6a3] {
        color: var(--bs-body-color);
        background: transparent;
    }

    .text-only .ma-sub-row:hover[b-qrwzzzc6a3],
    .text-only .ma-sub-row:focus-visible[b-qrwzzzc6a3] {
        background: var(--bs-secondary-bg);
        color: var(--bs-body-color);
    }

    .text-only .ma-mobile-offcanvas[b-qrwzzzc6a3],
    .text-only .ma-offcanvas-body[b-qrwzzzc6a3],
    .text-only .ma-mobile-theme-row[b-qrwzzzc6a3] {
        background: var(--bs-body-bg) !important;
        border-color: var(--bs-border-color) !important;
    }

    .text-only .ma-offcanvas-header[b-qrwzzzc6a3] {
        background: var(--bs-card-cap-bg) !important;
        border-bottom: 1px solid var(--bs-border-color) !important;
        color: var(--bs-body-color) !important;
        text-shadow: none !important;
    }

    .text-only .ma-offcanvas-title[b-qrwzzzc6a3] {
        font-family: var(--bs-font-sans-serif) !important;
        letter-spacing: 0 !important;
        text-transform: none !important;
    }

    .text-only .ma-close-btn[b-qrwzzzc6a3],
    .text-only .ma-mobile-chevron-btn[b-qrwzzzc6a3],
    .text-only .ma-mobile-row[b-qrwzzzc6a3],
    .text-only .ma-mobile-row-title[b-qrwzzzc6a3],
    .text-only .ma-mobile-row--sub[b-qrwzzzc6a3],
    .text-only .ma-mobile-theme-label[b-qrwzzzc6a3] {
        color: var(--bs-body-color) !important;
        border-color: var(--bs-border-color) !important;
        text-shadow: none !important;
    }

    .text-only .ma-mobile-row[b-qrwzzzc6a3],
    .text-only .ma-mobile-row-title[b-qrwzzzc6a3],
    .text-only .ma-mobile-row--sub[b-qrwzzzc6a3],
    .text-only .ma-mobile-theme-label[b-qrwzzzc6a3] {
        font-family: var(--bs-font-sans-serif) !important;
        letter-spacing: 0 !important;
        text-transform: none !important;
    }

        .text-only .ma-mobile-row:hover[b-qrwzzzc6a3],
        .text-only .ma-mobile-row:focus-visible[b-qrwzzzc6a3],
        .text-only .ma-mobile-row--parent:hover[b-qrwzzzc6a3],
        .text-only .ma-mobile-row--parent:focus-visible[b-qrwzzzc6a3],
        .text-only .ma-mobile-theme-btn:hover[b-qrwzzzc6a3] {
            background: var(--bs-secondary-bg) !important;
            color: var(--bs-body-color) !important;
        }

    .text-only .ma-mobile-sub-list[b-qrwzzzc6a3] {
        background: transparent !important;
        border-left-color: var(--bs-border-color) !important;
    }

    .text-only .ma-mobile-theme-btn[b-qrwzzzc6a3] {
        background: transparent !important;
        color: var(--bs-body-color) !important;
        border-color: var(--bs-border-color) !important;
    }

    .text-only .btn-check:checked + .ma-mobile-theme-btn[b-qrwzzzc6a3] {
        background: var(--bs-body-color) !important;
        color: var(--bs-body-bg) !important;
        border-color: var(--bs-body-color) !important;
    }
    /* Plain dropdown */
    .text-only .ma-dropdown[b-qrwzzzc6a3] {
        background: var(--bs-body-bg);
        border-color: var(--bs-border-color);
    }

    .text-only .ma-dropdown-item[b-qrwzzzc6a3] {
        font-family: var(--bs-font-sans-serif);
        color: var(--bs-body-color);
    }

        .text-only .ma-dropdown-item:hover[b-qrwzzzc6a3],
        .text-only .ma-dropdown-item:focus[b-qrwzzzc6a3] {
            background: var(--bs-secondary-bg);
            color: var(--bs-body-color);
        }
    /* Plain action buttons inside user dropdown */
    .text-only .ma-btn-primary[b-qrwzzzc6a3],
    .text-only .ma-btn-secondary[b-qrwzzzc6a3],
    .text-only .ma-user-menu-action[b-qrwzzzc6a3] {
        background: var(--bs-secondary-bg) !important;
        background-color: var(--bs-secondary-bg) !important;
        border-color: var(--bs-border-color) !important;
        color: var(--bs-body-color) !important;
        font-family: var(--bs-font-sans-serif) !important;
        font-size: 0.875rem !important;
        letter-spacing: normal !important;
        text-shadow: none !important;
        box-shadow: none !important;
    }

        .text-only .ma-btn-primary:hover[b-qrwzzzc6a3],
        .text-only .ma-btn-secondary:hover[b-qrwzzzc6a3],
        .text-only .ma-user-menu-action:hover[b-qrwzzzc6a3] {
            background: var(--bs-tertiary-bg) !important;
            background-color: var(--bs-tertiary-bg) !important;
            color: var(--bs-body-color) !important;
        }
    /* Disable all animations in text-only mode */
    .text-only .ma-flap.is-cycling[b-qrwzzzc6a3]::before,
    .text-only .ma-flap.is-cycling[b-qrwzzzc6a3]::after,
    .text-only .ma-status-badge--boarding[b-qrwzzzc6a3],
    .text-only .ma-flap--loading[b-qrwzzzc6a3] {
        animation: none !important;
    }
    /* ── Mobile menu theme switcher row ── */
    .ma-mobile-theme-row[b-qrwzzzc6a3] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 20px;
        border-top: 2px solid var(--board-frame);
        /* keep the theme row fixed at the bottom of the visible mobile menu */
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        margin-top: 0;
        background: var(--board-bg);
        gap: 12px;
        z-index: 1105;
    }

    .ma-mobile-theme-label[b-qrwzzzc6a3] {
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 0.82rem;
        color: var(--board-amber);
        letter-spacing: 0.1em;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .ma-mobile-theme-fieldset[b-qrwzzzc6a3] {
        border: none;
        padding: 0;
        margin: 0;
    }

    .ma-mobile-theme-btn[b-qrwzzzc6a3] {
        background: transparent !important;
        border: 1px solid var(--board-frame) !important;
        color: var(--board-amber) !important;
        border-radius: 4px !important;
        width: 36px;
        height: 36px;
        padding: 0;
        font-size: 0.85rem;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: background 120ms, color 120ms;
    }

        .ma-mobile-theme-btn:hover[b-qrwzzzc6a3] {
            background: var(--board-frame) !important;
            color: var(--board-amber) !important;
        }

    .btn-check:checked + .ma-mobile-theme-btn[b-qrwzzzc6a3] {
        background: var(--board-frame) !important;
        color: var(--board-amber) !important;
        border-color: var(--board-amber) !important;
    }

    [data-bs-theme=light] .ma-mobile-theme-row[b-qrwzzzc6a3] {
        background: rgba(245, 235, 200, 0.97);
        border-top-color: var(--theme-light-accent);
    }

    [data-bs-theme=light] .ma-mobile-theme-label[b-qrwzzzc6a3] {
        color: var(--theme-light-accent);
    }

    [data-bs-theme=light] .ma-mobile-theme-btn[b-qrwzzzc6a3] {
        border-color: var(--theme-light-accent) !important;
        color: var(--theme-light-accent) !important;
    }

    [data-bs-theme=light] .btn-check:checked + .ma-mobile-theme-btn[b-qrwzzzc6a3] {
        background: var(--theme-light-accent) !important;
        color: var(--theme-light-menu-bg) !important;
        border-color: var(--theme-dark-btn-bg) !important;
    }
    /* Explicit default (unselected) appearance for utility buttons to ensure
   a visible background and border when not hovered/active. Use a
   higher-specificity selector and :not() to target the idle state. */
    /* Default idle appearance for all utility buttons (search, basket, notifications, user) is amber.
           Scoped to html:not(.text-only) so these amber rules do not apply in text-only mode. */
    html:not(.text-only) .ma-utility-bar .ma-search-btn:not(:hover):not(:active):not(.active)[b-qrwzzzc6a3],
    html:not(.text-only) .ma-utility-bar .ma-basket-btn:not(:hover):not(:active):not(.active)[b-qrwzzzc6a3],
    html:not(.text-only) .ma-utility-bar .notifications-dropdown-toggle:not(:hover):not(:active):not(.active)[b-qrwzzzc6a3],
    html:not(.text-only) .ma-utility-bar .ma-user-btn:not(:hover):not(:active):not(.active)[b-qrwzzzc6a3] {
        background-color: var(--board-amber) !important;
        border: 1px solid var(--board-amber) !important;
        color: var(--theme-dark-page-bg) !important;
    }

    html:not(.text-only) .ma-utility-bar .ma-user-btn:not(:hover):not(:active):not(.active)[b-qrwzzzc6a3] {
        background-color: var(--board-amber) !important;
        border: 1px solid var(--board-amber) !important;
        color: var(--theme-dark-page-bg) !important;
    }

/* /Components/Pages/BasePages/memberDetailPage.razor.rz.scp.css */
.member-form[b-bg65h3i533] {
    position: relative;
    display: block;
    overflow: visible; /* or auto if you want to clip overflow */
    width: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
}

.member-form[b-bg65h3i533]  form {
    border-left: 1px solid;
    background-color: var(--bs-secondary-bg-subtle)!important;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-color: var(--bs-border-color);
    border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius);
    padding: 30px;
}

.nav-link[b-bg65h3i533] {
    font-size: 1rem;
    border-color: var(--bs-nav-tabs-link-hover-border-color);
}

.nav-link.active[b-bg65h3i533] {
    background-color: var(--theme-dark-btn-bg) !important;
    border-bottom:none;
    color: var(--theme-light-text);
}

.text-only .nav-link.active[b-bg65h3i533] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    border-bottom: none;
    color: rgba(var(--bs-body-bg-rgb),1) !important;
}

.text-only .nav-link:hover[b-bg65h3i533] {
    color: rgba(var(--bs-body-color-rgb),1) !important;

}

.text-only .nav-link.active:hover[b-bg65h3i533] {
    color: rgba(var(--bs-body-bg-rgb),1) !important;
}


.tab-content[b-bg65h3i533] {
    flex: 1 1 auto;
    display: block;
    min-height: 650px; /* Set this to the height of your largest tab, adjust as needed */
    /* Optionally: */
    /* height: 100%; */
    /* overflow: auto; */
}

.member-form[b-bg65h3i533]  form textarea {
    min-height:230px;
}

.text-only .member-form[b-bg65h3i533]  form {
    background: rgba(var(--bs-body-bg-rgb),var(--bs-bg-opacity)) !important
}
/* /Components/Pages/BasePages/OrderDetailPage.razor.rz.scp.css */
/* /Components/Pages/BasePages/ProfilePage.razor.rz.scp.css */
/* ── Card header / footer tighter padding (legacy pretty-border removed) ── */
.card-header[b-l7ogonbvf2] {
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

.card-footer[b-l7ogonbvf2] {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.text-only .text-bg-secondary[b-l7ogonbvf2] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    color: rgba(var(--bs-body-bg-rgb),1) !important
}

.text-only .nav-pills .nav-link.active[b-l7ogonbvf2] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    color: rgba(var(--bs-body-bg-rgb),1) !important;
}

    .text-only .nav-pills .nav-link.active:hover[b-l7ogonbvf2] {
        color: rgba(var(--bs-body-bg-rgb),1) !important;
        font-weight: bolder;
    }

.text-only .nav-pills .nav-link:hover[b-l7ogonbvf2] {
    color: rgba(var(--bs-body-color-rgb),1) !important;
}

.text-only .card .card-footer[b-l7ogonbvf2] {
    padding-bottom: 10px !important;
}

.list-group-item[b-l7ogonbvf2] {
    margin: 6px;
    border-bottom: 0px;
}

.text-only .list-group-item[b-l7ogonbvf2] {
    margin: 0px;
    color: rgba(var(--bs-body-color-rgb),1) !important;
    background-color: transparent;
    border-bottom: solid 1px rgba(var(--bs-border-color-translucent),1);
}

/* ── Profile icon badge — theme-aware ── */
.profile-icon-badge[b-l7ogonbvf2] {
    background-color: var(--theme-light-accent);
    color: #fff;
    font-size: 1rem;
    padding: 0.4em 0.55em;
}

[data-bs-theme=dark] .profile-icon-badge[b-l7ogonbvf2] {
    background-color: var(--theme-dark-accent);
    color: #000;
}

.text-only .profile-icon-badge[b-l7ogonbvf2] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    color: rgba(var(--bs-body-bg-rgb),1) !important;
}

/* ── Profile empty-state pauses to avoid vertical jump between tabs ── */
.profile-empty-state[b-l7ogonbvf2] {
    min-height: 260px;
    padding: 1.8rem 0 1rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    text-align: center;
}

.profile-empty-state > *[b-l7ogonbvf2] {
    width: 100%;
}

.profile-tab-content .card[b-l7ogonbvf2] {
    min-height: 430px;
}

.profile-tab-content .card-body[b-l7ogonbvf2] {
    padding: 1.25rem 1.5rem;
}

.profile-tab-content .card-body.mb-3[b-l7ogonbvf2] {
    margin-bottom: 0;
}

/* ── Profile flip-board side navigation ── */
.ma-side-board[b-l7ogonbvf2] {
    background: var(--board-bg);
    border: 2px solid var(--board-frame);
    border-top: 4px solid var(--board-frame);
    box-shadow: 0 6px 28px rgba(0,0,0,0.55);
    overflow: hidden;
    margin-top: 0;
}

@media (max-width: 767px) {
    .ma-side-board[b-l7ogonbvf2] {
        margin-top: 12px;
    }
}

.ma-side-board-header[b-l7ogonbvf2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--theme-dark-btn-bg);
    padding: 6px 10px;
    border-bottom: 1px solid rgba(242,194,75,0.3);
}

.ma-side-board-title[b-l7ogonbvf2] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    color: #000;
    text-transform: uppercase;
}

.ma-side-board-lamps[b-l7ogonbvf2] {
    display: flex;
    flex-direction: row;
    gap: 5px;
    align-items: center;
}

.ma-side-rows[b-l7ogonbvf2] {
    display: flex;
    flex-direction: column;
}

.ma-side-row[b-l7ogonbvf2] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    padding: 5px 8px 5px 10px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    width: 100%;
    background: transparent;
    border-bottom: 1px solid var(--board-flap-line, rgba(255,255,255,0.08));
    border-left: 3px solid transparent;
    transition: background 120ms ease, border-left-color 120ms ease;
    text-align: left;
    overflow: hidden;
    min-width: 0;
    box-sizing: border-box;
}

.ma-side-row:last-child[b-l7ogonbvf2] {
    border-bottom: none;
}

.ma-side-row:hover[b-l7ogonbvf2],
.ma-side-row:focus-visible[b-l7ogonbvf2] {
    background: rgba(184,134,11,0.14);
    border-left-color: rgba(184,134,11,0.5);
    outline: none;
}

.ma-side-row--active[b-l7ogonbvf2] {
    background: rgba(184,134,11,0.10);
    border-left-color: var(--board-amber);
    box-shadow: inset 3px 0 8px rgba(184,134,11,0.15);
}

.ma-side-active-dot[b-l7ogonbvf2] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--board-amber);
    box-shadow: 0 0 6px var(--board-amber);
    flex-shrink: 0;
    animation: ma-dot-pulse-b-l7ogonbvf2 1.4s ease-in-out infinite;
}

@keyframes ma-dot-pulse-b-l7ogonbvf2 {
    0%, 100% { opacity: 1; box-shadow: 0 0 6px var(--board-amber); }
    50%       { opacity: 0.4; box-shadow: 0 0 2px var(--board-amber); }
}

.ma-side-board .ma-col-flaps[b-l7ogonbvf2] {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}

.ma-side-board .ma-flap[b-l7ogonbvf2] {
    background: var(--board-flap);
    border-right: 1px solid var(--board-bg);
    color: transparent;
    display: flex;
    flex-direction: column;
    height: 24px;
    width: 12px;
    position: relative;
    flex-shrink: 0;
}

    .ma-side-board .ma-flap[b-l7ogonbvf2]::before {
        background: var(--board-flap);
        border-bottom: 1px solid rgba(255,255,255,0.12);
        content: attr(data-char);
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 15px;
        font-weight: 600 !important;
        line-height: 24px;
        height: 12px;
        overflow: hidden;
        text-align: center;
        width: 100%;
        color: var(--board-amber);
        text-shadow: 0 0 8px var(--board-amber-dim);
        z-index: 2;
        display: block;
    }

    .ma-side-board .ma-flap[b-l7ogonbvf2]::after {
        background: var(--board-flap-line);
        content: attr(data-char);
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 15px;
        line-height: 24px;
        height: 24px;
        font-weight: 600 !important;
        margin-top: -12px;
        overflow: hidden;
        text-align: center;
        width: 100%;
        color: var(--board-amber);
        opacity: 0.7;
        text-shadow: 0 0 5px var(--board-amber-dim);
        z-index: 1;
        display: block;
    }

.ma-side-board .ma-flap[data-char=" "][b-l7ogonbvf2]::before,
.ma-side-board .ma-flap[data-char=" "][b-l7ogonbvf2]::after {
    content: '\00a0';
}

.ma-side-board .ma-flap.is-cycling[b-l7ogonbvf2]::before,
.ma-side-board .ma-flap.is-cycling[b-l7ogonbvf2]::after {
    color: var(--board-amber);
    text-shadow: 0 0 14px var(--board-amber);
    animation: ma-cycle 90ms linear infinite;
}

/* ── Light theme ── */
[data-bs-theme=light] .ma-side-board[b-l7ogonbvf2] {
    background: var(--theme-light-menu-bg);
    border-color: var(--theme-light-accent);
    border-top-color: var(--theme-light-accent);
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}

[data-bs-theme=light] .ma-side-board-header[b-l7ogonbvf2] {
    background: var(--theme-light-accent);
    border-bottom-color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-side-board-title[b-l7ogonbvf2] {
    color: #fff;
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-l7ogonbvf2] {
    background: var(--theme-light-menu-bg);
    border-right-color: rgba(120,82,10,0.12);
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-l7ogonbvf2]::before {
    background: var(--theme-light-menu-bg);
    border-bottom-color: rgba(120,82,10,0.25);
    color: var(--theme-light-accent);
    text-shadow: none;
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-l7ogonbvf2]::after {
    background: var(--theme-light-menu-bg);
    color: var(--theme-light-accent);
    text-shadow: none;
    opacity: 0.55;
}

[data-bs-theme=light] .ma-side-board .ma-flap.is-cycling[b-l7ogonbvf2]::before,
[data-bs-theme=light] .ma-side-board .ma-flap.is-cycling[b-l7ogonbvf2]::after {
    color: var(--theme-light-accent);
    text-shadow: none;
}

[data-bs-theme=light] .ma-side-row[b-l7ogonbvf2] {
    border-bottom-color: rgba(120,82,10,0.22);
    border-left-color: transparent;
}

[data-bs-theme=light] .ma-side-row:hover[b-l7ogonbvf2],
[data-bs-theme=light] .ma-side-row:focus-visible[b-l7ogonbvf2] {
    background: rgba(120,82,10,0.07);
    border-left-color: rgba(120,82,10,0.4);
}

[data-bs-theme=light] .ma-side-row--active[b-l7ogonbvf2] {
    background: rgba(120,82,10,0.10);
    border-left-color: var(--theme-light-accent);
    box-shadow: inset 3px 0 8px rgba(120,82,10,0.12);
}

[data-bs-theme=light] .ma-side-active-dot[b-l7ogonbvf2] {
    background: var(--theme-light-accent);
    box-shadow: 0 0 6px rgba(120,82,10,0.5);
}

/* ── Text-only mode ── */
.text-only .ma-side-board[b-l7ogonbvf2] {
    background: transparent;
    border: 1px solid var(--bs-border-color);
    border-top-width: 1px;
    box-shadow: none;
}

.text-only .ma-side-board-header[b-l7ogonbvf2] {
    background: var(--bs-secondary-bg);
    border-bottom-color: var(--bs-border-color);
}

.text-only .ma-side-board-title[b-l7ogonbvf2] {
    color: var(--bs-body-color);
    font-family: var(--bs-font-sans-serif);
    font-size: 0.7rem;
    letter-spacing: 0;
}

.text-only .ma-side-row[b-l7ogonbvf2] {
    border-left: none;
    border-bottom-color: var(--bs-border-color);
    padding: 6px 10px;
}

.text-only .ma-side-row:hover[b-l7ogonbvf2] {
    background: var(--bs-secondary-bg);
}

.text-only .ma-side-row--active[b-l7ogonbvf2] {
    background: var(--bs-secondary-bg);
    border-left: 3px solid var(--theme-primary);
    box-shadow: none;
}

.text-only .ma-side-board .ma-flap[b-l7ogonbvf2],
.text-only .ma-side-board .ma-side-active-dot[b-l7ogonbvf2],
.text-only .ma-side-board .ma-side-board-lamps[b-l7ogonbvf2] {
    display: none;
}

.text-only .ma-side-board .ma-col-flaps[b-l7ogonbvf2]::after {
    content: attr(data-dest);
    font-family: var(--bs-font-sans-serif);
    font-size: 0.9rem;
    color: var(--bs-body-color);
    text-transform: capitalize;
    letter-spacing: 0;
}
/* /Components/Pages/CheckoutPage.Razor.rz.scp.css */
.form-header[b-6vjf7p8hlz] {
    gap: 5px;
    text-align: center;
    font-size: 1em;
}

    .form-header .stepIndicator[b-6vjf7p8hlz] {
        position: relative;
        flex: 1;
        padding-bottom: 40px;
        
    }

        .form-header .stepIndicator.active[b-6vjf7p8hlz] {
            font-weight: 800;
        }

        .form-header .stepIndicator.finish[b-6vjf7p8hlz] {
            font-weight: 800;
            color: #009688;
        }

        .form-header .stepIndicator[b-6vjf7p8hlz]::before {
            content: "";
            position: absolute;
            left: 50%;
            bottom: 0;
            transform: translateX(-50%);
            z-index: 1;
            width: 30px;
            height: 30px;
            background-color: black;
            border-radius: 50%;
            border: 3px solid #ecf5f4;
        }

        .form-header .stepIndicator.active[b-6vjf7p8hlz]::before {
            background-color: #990000;
            border: 3px solid #d5f9f6;
        }

        .form-header .stepIndicator.finish[b-6vjf7p8hlz]::before {
            background-color: #990000;
            border: 3px solid #990000;
        }

        .form-header .stepIndicator[b-6vjf7p8hlz]::after {
            content: "";
            position: absolute;
            left: 50%;
            bottom: 15px;
            width: 100%;
            height: 3px;
            background-color: #f3f3f3;
        }

        .form-header .stepIndicator.active[b-6vjf7p8hlz]::after {
            background-color: #990000;
        }

        .form-header .stepIndicator.finish[b-6vjf7p8hlz]::after {
            background-color: #009688;
        }

        .form-header .stepIndicator:last-child[b-6vjf7p8hlz]:after {
            display: none;
        }


.step[b-6vjf7p8hlz] {
    display: none;
}
    .step.active[b-6vjf7p8hlz] {
        display: initial;
    }

.min-h0[b-6vjf7p8hlz] {
    min-height:0;
}

.mvh-50[b-6vjf7p8hlz] {
    min-height: -moz-calc(100% - 400px); /* Firefox */
    min-height: -webkit-calc(100% - 400px); /* Chrome, Safari */
    min-height: calc(100vh - 400px); /* IE9+ and future browsers */
}

.basket:last-child[b-6vjf7p8hlz] {
    margin-bottom:20px;
}


.text-only .alert[b-6vjf7p8hlz] {
    background-color: var(--bs-body-bg) !important;
    border-color: var(--bs-border-color-translucent);
    --bs-alert-color: var(--bs-body-color);
    font-family: 'Ysabeau', sans-serif;
}

.text-only .text-secondary-emphasis[b-6vjf7p8hlz] {
    color: var(--bs-body-color) !important;
    font-family: 'Ysabeau', sans-serif;
}

.text-only .form-header .stepIndicator.finish[b-6vjf7p8hlz] {
    color: var(--bs-bg-body);
    font-family: 'Ysabeau', sans-serif;
}

.text-only .form-header .stepIndicator[b-6vjf7p8hlz]::before {
    border: 3px solid #ecf5f4;
    font-family: 'Ysabeau', sans-serif;
}

.text-only .form-header .stepIndicator.active[b-6vjf7p8hlz]::before {
    background-color: var(--bs-body-color);
    border: 3px solid #d5f9f6;
    font-family: 'Ysabeau', sans-serif;
}

.text-only .form-header .stepIndicator.finish[b-6vjf7p8hlz]::before {
    background-color: var(--bs-body-color);
    border: 3px solid #990000;
    font-family: 'Ysabeau', sans-serif;
}

.text-only .form-header .stepIndicator[b-6vjf7p8hlz]::after {
    background-color: var(--bs-border-color-translucent);
    font-family: 'Ysabeau', sans-serif;
}

.text-only .form-header .stepIndicator.active[b-6vjf7p8hlz]::after {
    background-color: var(--bs-body-color);
    font-family: 'Ysabeau', sans-serif;
}

.text-only .form-header .stepIndicator.finish[b-6vjf7p8hlz]::after {
    background-color: var(--bs-border-color-translucent);
    font-family: 'Ysabeau', sans-serif;
}


.text-only h1[b-6vjf7p8hlz],
.text-only h2[b-6vjf7p8hlz],
.text-only h3[b-6vjf7p8hlz],
.text-only h4[b-6vjf7p8hlz],
.text-only h5[b-6vjf7p8hlz],
.text-only p[b-6vjf7p8hlz],
.text-only a[b-6vjf7p8hlz],
.text-only button[b-6vjf7p8hlz],
.text-only cite[b-6vjf7p8hlz],
.text-only div[b-6vjf7p8hlz],
.text-only span[b-6vjf7p8hlz],
.text-only blockquote[b-6vjf7p8hlz] {
    font-family: 'Ysabeau', sans-serif;
}

.list-group-item[b-6vjf7p8hlz] {
    border-bottom: unset;
}

@media (max-width: 576px) {
    .checkout-bottom-text[b-6vjf7p8hlz] {
        display: block;
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100%;
    }

    .row.align-items-center[b-6vjf7p8hlz] {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    .row.align-items-center > .col-4[b-6vjf7p8hlz],
    .row.align-items-center > .col-8[b-6vjf7p8hlz] {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .row.align-items-center label[b-6vjf7p8hlz] {
        margin-bottom: 0.25rem;
        text-align: left;
        display: block;
    }
    .row.align-items-center .position-relative[b-6vjf7p8hlz] {
        margin-bottom: 1rem;
    }

}
/* /Components/Pages/ErrorPage.razor.rz.scp.css */
.ma-404-page[b-ap4xj1c7dw] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0.5rem 0 1rem;
    max-width: 78rem;
    margin: 0 auto;
}

.ma-404-copy[b-ap4xj1c7dw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: center;
    text-align: center;
}

.ma-404-copy h1[b-ap4xj1c7dw] {
    margin: 0;
    font-size: clamp(2rem, 4vw, 3.4rem);
    padding: 0.75rem 0 0.65rem;
    margin-bottom: 0.15rem;
}

.ma-404-kicker[b-ap4xj1c7dw],
.ma-404-meta[b-ap4xj1c7dw],
.ma-404-score-label[b-ap4xj1c7dw],
.ma-404-status[b-ap4xj1c7dw] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    letter-spacing: 0.08em;
}

.ma-404-kicker[b-ap4xj1c7dw] {
    margin: 0;
    color: var(--theme-dark-accent);
    text-transform: uppercase;
}

.ma-404-lead[b-ap4xj1c7dw] {
    margin: 0;
    max-width: 52rem;
    font-size: 1.125rem;
}

/* responsive typography for mobile fingertips */
@media (max-width: 900px) {
    .ma-404-copy h1[b-ap4xj1c7dw] {
        font-size: clamp(1.5rem, 6vw, 2.3rem);
        padding: 0.65rem 0 0.55rem;
    }

    .ma-404-copy p[b-ap4xj1c7dw],
    .ma-404-lead[b-ap4xj1c7dw],
    .ma-404-kicker[b-ap4xj1c7dw],
    .ma-404-meta[b-ap4xj1c7dw],
    .ma-404-score-label[b-ap4xj1c7dw],
    .ma-404-status[b-ap4xj1c7dw] {
        font-size: clamp(0.8rem, 3vw, 1.1rem);
    }

    .ma-404-hud[b-ap4xj1c7dw] {
        grid-template-columns: 1fr;
    }

    .ma-404-controls[b-ap4xj1c7dw] {
        grid-template-columns: 1fr;
    }

    .ma-404-scoreboard[b-ap4xj1c7dw] {
        text-align: center;
    }
}

.ma-404-game-shell[b-ap4xj1c7dw] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ma-404-hud[b-ap4xj1c7dw] {
    display: grid;
    gap: 0.75rem;
    align-items: stretch;
    grid-template-columns: minmax(15rem, 1.1fr) minmax(22rem, 1.4fr) minmax(9rem, 0.6fr);
}

.ma-404-meta[b-ap4xj1c7dw],
.ma-404-controls[b-ap4xj1c7dw],
.ma-404-scoreboard[b-ap4xj1c7dw] {
    background: rgba(10, 6, 2, 0.88);
    border: 1px solid var(--board-frame);
    border-radius: 0.75rem;
    padding: 0.75rem 1rem;
    color: var(--board-amber);
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.25);
}

.ma-404-meta[b-ap4xj1c7dw] {
    display: grid;
    gap: 0.35rem;
    align-content: center;
}

.ma-404-controls[b-ap4xj1c7dw] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 1rem;
}

.ma-404-control-block[b-ap4xj1c7dw] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.ma-404-flight-controls .btn[b-ap4xj1c7dw],
.ma-404-weather-controls .btn[b-ap4xj1c7dw] {
    min-width: 4.75rem;
}

.ma-404-slider-wrap[b-ap4xj1c7dw] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0;
    flex: 1;
}

.ma-404-slider-wrap input[b-ap4xj1c7dw] {
    width: 100%;
    accent-color: var(--theme-dark-accent);
}

.ma-404-weather-controls[b-ap4xj1c7dw] {
    flex-wrap: wrap;
    justify-content: center;
}

.ma-404-weather-chip[b-ap4xj1c7dw] {
    min-width: 2.75rem !important;
    padding-inline: 0.5rem;
}

.ma-404-scoreboard[b-ap4xj1c7dw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
}

.ma-404-score[b-ap4xj1c7dw] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1;
}

.ma-404-scene[b-ap4xj1c7dw] {
    position: relative;
    height: clamp(18rem, 42dvh, 24rem);
    overflow: hidden;
    border: 1px solid var(--board-frame);
    border-radius: 1rem;
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.2);
    isolation: isolate;
}

/* Tunable variables for building generation and autopilot.
   These can be read by `airship404.js` and overridden at runtime. */
.ma-404-scene[b-ap4xj1c7dw] {
    --ma-building-min-width: 46; /* px */
    --ma-building-max-width: 110; /* px */
    --ma-building-tall-threshold: 0.78; /* more tall/irregular buildings */
    --ma-building-min-height-factor: 0.14; /* fraction of scene height */
    --ma-building-max-height-factor: 0.50; /* fraction of scene height for tall */
    --ma-building-cluster-base: 0.15; /* base cluster probability */
    --ma-building-cluster-scale: 2.5; /* scale used when computing cluster prob */

    --ma-autopilot-kp: 0.6;
    --ma-autopilot-ki: 0.08;
    --ma-autopilot-kd: 0.12;
    --ma-autopilot-lookahead: 450; /* px lookahead distance */
}

.ma-404-scene:focus-visible[b-ap4xj1c7dw] {
    outline: 2px solid var(--theme-dark-accent);
    outline-offset: 4px;
}

.ma-footer-sky[b-ap4xj1c7dw] {
    position: relative;
    inset: 0;
    overflow: hidden;
    transition: background-color 1.5s ease;
}

.sky-dawn[b-ap4xj1c7dw] { background-color: #cb7264; }
.sky-day[b-ap4xj1c7dw] { background-color: #79addc; }
.sky-dusk[b-ap4xj1c7dw] { background-color: #5b3e6e; }
.sky-night[b-ap4xj1c7dw] { background-color: #0d1321; }

.ma-celestial[b-ap4xj1c7dw] {
    position: absolute;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    z-index: 1;
}

.sky-night .ma-celestial[b-ap4xj1c7dw] {
    background: #fdfdf5;
    box-shadow: 0 0 20px rgba(253, 253, 245, 0.8);
}

.sky-night .ma-moon-phase[b-ap4xj1c7dw] {
    position: absolute;
    inset: -1px;
    border-radius: 50%;
}

.sky-dawn .ma-celestial[b-ap4xj1c7dw],
.sky-dusk .ma-celestial[b-ap4xj1c7dw] {
    background: #ffb75e;
    box-shadow: 0 0 30px #ffb75e;
}

.sky-day .ma-celestial[b-ap4xj1c7dw] {
    background: #ffe38f;
    box-shadow: 0 0 40px #ffe38f;
}

.sky-day .ma-moon-phase[b-ap4xj1c7dw],
.sky-dawn .ma-moon-phase[b-ap4xj1c7dw],
.sky-dusk .ma-moon-phase[b-ap4xj1c7dw] {
    opacity: 0;
}

.ma-stars[b-ap4xj1c7dw],
.ma-shooting-stars[b-ap4xj1c7dw],
.ma-sky-clouds[b-ap4xj1c7dw],
.ma-birds[b-ap4xj1c7dw],
.ma-weather-overlay[b-ap4xj1c7dw],
.ma-rain-layer[b-ap4xj1c7dw],
.ma-snow-layer[b-ap4xj1c7dw],
.ma-fog-layer[b-ap4xj1c7dw],
.ma-lightning-layer[b-ap4xj1c7dw],
.ma-404-buildings-layer[b-ap4xj1c7dw],
.ma-404-witches-layer[b-ap4xj1c7dw] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* Shooting stars should only be visible at night */
.ma-shooting-stars[b-ap4xj1c7dw] {
    opacity: 0;
    pointer-events: none;
}
.sky-night .ma-shooting-stars[b-ap4xj1c7dw] {
    opacity: 1;
}

.ma-404-buildings-layer[b-ap4xj1c7dw] {
    z-index: 8;
}

.ma-404-witches-layer[b-ap4xj1c7dw] {
    z-index: 9;
}

.ma-stars[b-ap4xj1c7dw] {
    width: calc(100% + 400px);
    background-image:
        radial-gradient(1px 1px at 20px 30px, #fff, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 80px 70px, #fff, rgba(0,0,0,0)),
        radial-gradient(2px 2px at 150px 20px, #fff, rgba(0,0,0,0)),
        radial-gradient(1.5px 1.5px at 250px 90px, #fff, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 320px 40px, #fff, rgba(0,0,0,0));
    background-repeat: repeat;
    background-size: 400px 120px;
    opacity: 0;
    animation: ma-scroll-clouds-b-ap4xj1c7dw 240s linear infinite;
}

.sky-night .ma-stars[b-ap4xj1c7dw] { opacity: 0.8; }
.sky-dusk .ma-stars[b-ap4xj1c7dw] { opacity: 0.3; }

.ma-star-trail[b-ap4xj1c7dw] {
    position: absolute;
    width: 120px;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
    transform: rotate(-15deg);
    opacity: 0;
    animation: ma-shoot-b-ap4xj1c7dw 8s linear infinite;
}

.ma-star-trail:nth-child(1)[b-ap4xj1c7dw] { top: 20%; left: 80%; animation-delay: 2s; }
.ma-star-trail:nth-child(2)[b-ap4xj1c7dw] { top: 10%; left: 40%; animation-delay: 6s; }
.ma-star-trail:nth-child(3)[b-ap4xj1c7dw] { top: 40%; left: 70%; animation-delay: 11s; }

.sky-night .ma-shooting-stars[b-ap4xj1c7dw] { opacity: 1; }

.ma-skyline[b-ap4xj1c7dw],
.ma-city-lights[b-ap4xj1c7dw] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 42%;
    background-repeat: repeat-x;
    background-position: left bottom;
    background-size: 800px 100%;
    /* Keep the SVG skyline static so it doesn't conflict with generated buildings */
    animation: none !important;
    transform: none !important;
    background-position: left bottom !important;
}


/* Decorative baseline skyline removed; generated buildings supply the skyline.
   Keep these selectors available so the baseline can be restored easily if needed. */
.ma-skyline[b-ap4xj1c7dw],
.ma-city-lights[b-ap4xj1c7dw] {
    display: none !important;
}

/* Baseline decorative skyline removed; generated buildings supply the skyline. */

/* Ensure the buildings host container does not animate or transform */
.ma-404-buildings-layer[b-ap4xj1c7dw] {
    animation: none !important;
    /* allow child transforms (positioning applied via JS) */
}

/* Building elements should be block-level and absolutely positioned by JS only */
.ma-404-buildings-layer .ma-404-building[b-ap4xj1c7dw] {
    display: block !important;
    position: absolute !important;
}

/* Ensure the buildings host is positioned so its children are absolutely positioned
   relative to the scene, and set stacking so generated buildings sit above the
   baseline silhouette but below witches. */
.ma-404-buildings-layer[b-ap4xj1c7dw] {
    position: absolute !important;
    inset: 0 !important;
    z-index: 8;
}

.ma-404-buildings-layer[b-ap4xj1c7dw]::before {
    z-index: 0;
}

.ma-404-buildings-layer .ma-404-building[b-ap4xj1c7dw] {
    z-index: 2 !important;
}

.sky-dawn .ma-skyline[b-ap4xj1c7dw] { filter: sepia(1) saturate(1.8) hue-rotate(-8deg) brightness(1.2); }
.sky-day .ma-skyline[b-ap4xj1c7dw] { filter: sepia(1) saturate(2.6) hue-rotate(5deg) brightness(1.8); }
.sky-dusk .ma-skyline[b-ap4xj1c7dw] { filter: sepia(1) saturate(2.4) hue-rotate(25deg) brightness(1.2); }
.sky-night .ma-skyline[b-ap4xj1c7dw] { filter: saturate(0) brightness(4.5) contrast(1.2); }

.ma-city-lights[b-ap4xj1c7dw] {
    z-index: 3;
    opacity: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 220'%3E%3Crect x='10' y='165' width='6' height='8' fill='rgba(255,180,50,0.9)'/%3E%3Crect x='20' y='165' width='6' height='8' fill='rgba(255,180,50,0.9)'/%3E%3Crect x='60' y='120' width='5' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='110' y='145' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='140' y='145' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='182' y='90' width='5' height='10' fill='rgba(255,220,100,0.85)'/%3E%3Crect x='225' y='135' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='245' y='135' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='350' y='110' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='398' y='95' width='8' height='12' fill='rgba(255,220,100,0.9)'/%3E%3Crect x='420' y='95' width='8' height='12' fill='rgba(255,220,100,0.9)'/%3E%3Crect x='470' y='145' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='498' y='145' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='566' y='110' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='580' y='110' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='620' y='152' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='650' y='152' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='695' y='130' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3Crect x='750' y='165' width='7' height='10' fill='rgba(255,180,50,0.8)'/%3E%3C/svg%3E");
}

.sky-night .ma-city-lights[b-ap4xj1c7dw] { opacity: 1; }
.sky-dusk .ma-city-lights[b-ap4xj1c7dw] { opacity: 0.5; }
.sky-dawn .ma-city-lights[b-ap4xj1c7dw] { opacity: 0.2; }

.ma-sky-clouds[b-ap4xj1c7dw] {
    width: calc(100% + 800px);
    opacity: 0;
    transition: opacity 1.5s ease, filter 1.5s ease;
    z-index: 3;
}

.ma-sky-clouds-hi[b-ap4xj1c7dw] {
    height: 50%;
    background:
        radial-gradient(ellipse at 14% 58%, rgba(255,255,255,0.32) 0%, rgba(255,255,255,0.18) 22%, rgba(255,255,255,0.02) 42%, transparent 62%),
        radial-gradient(ellipse at 39% 46%, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0.16) 24%, rgba(255,255,255,0.02) 46%, transparent 64%),
        radial-gradient(ellipse at 65% 54%, rgba(255,255,255,0.24) 0%, rgba(255,255,255,0.14) 22%, rgba(255,255,255,0.02) 44%, transparent 64%),
        radial-gradient(ellipse at 86% 44%, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0.16) 22%, rgba(255,255,255,0.02) 44%, transparent 62%);
    animation: ma-scroll-sky-hi-b-ap4xj1c7dw 70s linear infinite;
    filter: blur(12px);
}

.ma-sky-clouds-lo[b-ap4xj1c7dw] {
    top: 8%;
    height: 44%;
    background:
        radial-gradient(ellipse at 18% 62%, rgba(255,255,255,0.26) 0%, rgba(255,255,255,0.14) 24%, rgba(255,255,255,0.02) 46%, transparent 64%),
        radial-gradient(ellipse at 43% 49%, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.12) 24%, rgba(255,255,255,0.02) 46%, transparent 66%),
        radial-gradient(ellipse at 70% 57%, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.11) 24%, rgba(255,255,255,0.02) 48%, transparent 68%),
        radial-gradient(ellipse at 90% 50%, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.12) 22%, rgba(255,255,255,0.02) 44%, transparent 62%);
    animation: ma-scroll-sky-lo-b-ap4xj1c7dw 115s linear infinite;
    filter: blur(10px);
}

.ma-sky-clouds-hi[b-ap4xj1c7dw] { opacity: calc(var(--cloud-cover, 0) / 100 * 0.92); }
.ma-sky-clouds-lo[b-ap4xj1c7dw] { opacity: calc(var(--cloud-cover, 0) / 100 * 0.72); }
.weather-clear .ma-sky-clouds[b-ap4xj1c7dw] { opacity: 0 !important; }
.weather-rain .ma-sky-clouds[b-ap4xj1c7dw],
.weather-drizzle .ma-sky-clouds[b-ap4xj1c7dw],
.weather-storm .ma-sky-clouds[b-ap4xj1c7dw] { filter: brightness(0.7) saturate(0.5); }
.weather-fog .ma-sky-clouds[b-ap4xj1c7dw] { opacity: 0.75 !important; filter: brightness(0.9) saturate(0.2); }
.weather-snow .ma-sky-clouds[b-ap4xj1c7dw] { filter: brightness(1) saturate(0.3); }
.sky-night .ma-sky-clouds[b-ap4xj1c7dw] { filter: brightness(0.25) !important; }

.ma-birds[b-ap4xj1c7dw] {
    z-index: 4;
}

.sky-night .ma-birds[b-ap4xj1c7dw] { opacity: 0; }

.ma-bird-group[b-ap4xj1c7dw] {
    position: absolute;
    right: -100px;
    animation: ma-fly-birds-b-ap4xj1c7dw linear infinite;
}

.ma-bird-group.ma-bird-1[b-ap4xj1c7dw] { top: 20px; animation-duration: 45s; animation-delay: 5s; }
.ma-bird-group.ma-bird-2[b-ap4xj1c7dw] { top: 35px; animation-duration: 55s; animation-delay: 15s; }
.ma-bird-group.ma-bird-3[b-ap4xj1c7dw] { top: 10px; animation-duration: 38s; animation-delay: 35s; }

.ma-bird-svg[b-ap4xj1c7dw] {
    width: 28px;
    fill: #111;
    opacity: 0.7;
    animation: ma-flap-b-ap4xj1c7dw 0.4s alternate infinite ease-in-out;
}

.ma-404-player[b-ap4xj1c7dw] {
    position: absolute;
    left: clamp(2rem, 10vw, 6rem);
    width: clamp(6rem, 12vw, 8.5rem);
    height: clamp(4.32rem, 8.64vw, 6.12rem);
    transform: translateY(-50%);
    transition: top 0.12s linear, transform 1.15s ease-in, opacity 1.15s ease-in;
    z-index: 10;
}

.ma-404-player .ma-dirigible[b-ap4xj1c7dw] {
    position: relative;
    left: 0;
    width: 100%;
    height: 100%;
    animation: none;
}

.ma-404-player.is-impact[b-ap4xj1c7dw] {
    animation: ma-404-impact-pop-b-ap4xj1c7dw 0.18s ease-out;
}

.ma-dirigible-bob[b-ap4xj1c7dw] {
    width: 100%;
    height: 100%;
    animation: ma-dirigible-bob-b-ap4xj1c7dw 4s ease-in-out infinite alternate;
    filter: drop-shadow(0 6px 10px rgba(0,0,0,0.4));
}

.sky-night .ma-dirigible-bob[b-ap4xj1c7dw] {
    filter: brightness(0.6) drop-shadow(0 6px 10px rgba(0,0,0,0.8));
}

.sky-night .cabin-lights[b-ap4xj1c7dw] { fill: #fff185 !important; }
.sky-dusk .cabin-lights[b-ap4xj1c7dw],
.sky-dawn .cabin-lights[b-ap4xj1c7dw] { fill: #ffdf65 !important; }
.sky-day .cabin-lights[b-ap4xj1c7dw] { fill: #444 !important; }

.propeller-spin[b-ap4xj1c7dw] {
    transform-origin: 40px 92px;
    animation: ma-spin-b-ap4xj1c7dw 0.3s linear infinite;
}

.ma-404-obstacle[b-ap4xj1c7dw] {
    position: absolute;
    left: 0;
    top: 0;
    will-change: transform;
}

.ma-404-witch[b-ap4xj1c7dw] {
    width: 32px;
    height: 24px;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,0.6));
}

.ma-404-witch svg[b-ap4xj1c7dw] {
    width: 100%;
    height: 100%;
    animation: ma-witch-bob-b-ap4xj1c7dw 2.2s ease-in-out infinite alternate;
}

/* Buildings should not inherit any bob/translate animations applied to witches */
.ma-404-building[b-ap4xj1c7dw],
.ma-404-building *[b-ap4xj1c7dw] {
    animation: none !important;
    transition: none !important;
    background-clip: padding-box;
}

.ma-404-building[b-ap4xj1c7dw] {
    border-radius: 0.12em 0.12em 0 0;
    box-shadow: inset 0 -0.35rem 1rem rgba(0,0,0,0.55), 0 0 1rem rgba(0,0,0,0.3);
    border: 1px solid rgba(255,255,255,0.08);
    background-image:
        linear-gradient(180deg, rgba(55,42,28,0.96), rgba(22,16,12,0.97));
    background-size: 100% 100%;
    position: relative;
    overflow: hidden;
}

.ma-404-building[b-ap4xj1c7dw]::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 100%;
    width: 100%;
    height: 1rem;
    background: linear-gradient(180deg, #694e39 0%, #3f2f23 100%);
    border-bottom: 4px solid #30241b;
}

.ma-404-building[b-ap4xj1c7dw]::after {
    content: "";
    position: absolute;
    right: 8px;
    bottom: calc(100% + 2px);
    width: 4px;
    height: 10px;
    background: linear-gradient(180deg, #34261c 0%, #20170f 100%);
    border: 1px solid rgba(255,255,255,0.2);
    box-shadow: inset 0 1px 1px rgba(255,255,255,0.08), 0 0 3px rgba(0,0,0,0.6);
}

.ma-404-building .ma-404-roof[b-ap4xj1c7dw] {
    position: absolute;
    left: 0;
    width: 100%;
    height: 14px;
    bottom: 100%;
    box-shadow: inset 0 -3px 5px rgba(0,0,0,0.5), 0 2px 4px rgba(0,0,0,0.35);
}

.ma-404-building .ma-404-chimney[b-ap4xj1c7dw] {
    opacity: 0.92;
}

.ma-404-window-sprite[b-ap4xj1c7dw] {
    background: rgba(255, 235, 160, 0.92);
    box-shadow: 0 0 6px rgba(255,220,160,0.45);
    opacity: 0.88;
    transition: opacity 0.25s ease, background 0.25s ease;
}

.ma-404-window-sprite:nth-child(even)[b-ap4xj1c7dw] {
    opacity: 0.62;
    background: rgba(80, 70, 50, 0.65);
}

.ma-404-smoke[b-ap4xj1c7dw] {
    position: absolute;
    width: 6px;
    height: 14px;
    border-radius: 50%;
    opacity: 0.35;
    background: radial-gradient(circle at 50% 20%, rgba(255,255,255,0.7), rgba(220,220,220,0.35) 40%, rgba(190,190,190,0.0) 80%);
    filter: blur(1.6px);
    animation: ma-404-smoke-b-ap4xj1c7dw 4.1s ease-in-out infinite;
    pointer-events: none;
    z-index: 995;
}

@keyframes ma-404-smoke-b-ap4xj1c7dw {
    0% { transform: translate(0,0) scale(0.8); opacity: 0.28; }
    25% { transform: translate(1px,-10px) scale(0.92); opacity: 0.24; }
    50% { transform: translate(-1px,-20px) scale(1.05); opacity: 0.17; }
    75% { transform: translate(1px,-30px) scale(1.12); opacity: 0.14; }
    100% { transform: translate(2px,-40px) scale(1.25); opacity: 0; }
}

@keyframes ma-404-smoke-2-b-ap4xj1c7dw {
    0% { transform: translate(0,0) scale(0.75); opacity: 0.3; }
    30% { transform: translate(-1px,-13px) scale(0.9); opacity: 0.27; }
    60% { transform: translate(0px,-26px) scale(1.05); opacity: 0.2; }
    100% { transform: translate(-3px,-48px) scale(1.15); opacity: 0; }
}

@keyframes ma-404-smoke-3-b-ap4xj1c7dw {
    0% { transform: translate(0,0) scale(0.85); opacity: 0.33; }
    20% { transform: translate(2px,-9px) scale(0.9); opacity: 0.28; }
    50% { transform: translate(0px,-22px) scale(1.03); opacity: 0.2; }
    100% { transform: translate(4px,-45px) scale(1.18); opacity: 0; }
}

.ma-404-building--tall[b-ap4xj1c7dw] {
    background-image: linear-gradient(180deg, #4b3e31 0%, #241d17 100%);
}

.ma-404-building--tower[b-ap4xj1c7dw] {
    background-image: linear-gradient(180deg, #685e52 0%, #453c34 40%, #221a14 100%);
    border-radius: 0.2rem 0.2rem 0 0;
    box-shadow: inset 0 -0.3rem 0.8rem rgba(0,0,0,0.55), 0 0.25rem 0.75rem rgba(0,0,0,0.3);
}

.ma-404-building--gothic[b-ap4xj1c7dw] {
    background-image: linear-gradient(180deg, #604c38 0%, #422e1e 40%, #201410 100%);
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: inset 0 -0.45rem 0.95rem rgba(0,0,0,0.65), 0 0.4rem 1.2rem rgba(0,0,0,0.4);
}

.ma-404-building--cathedral[b-ap4xj1c7dw] {
    background-image: linear-gradient(180deg, #504436 0%, #362a1e 45%, #1c1510 100%);
    border: 1px solid rgba(255,255,255,0.1);
    box-shadow: inset 0 -0.45rem 1rem rgba(0,0,0,0.65), 0 0.5rem 1.5rem rgba(0,0,0,0.35);
}

.ma-404-building--cathedral .ma-404-roof[b-ap4xj1c7dw] {
    position: absolute;
    left: 0;
    width: 100%;
    height: 18px;
    bottom: 100%;
    background: linear-gradient(180deg, #7a6a52 0%, #3e3226 100%);
    border-bottom: 5px solid #1e1510;
    border-radius: 0.15rem 0.15rem 0 0;
}

.ma-404-building--cathedral .ma-404-spires[b-ap4xj1c7dw] {
    position: absolute;
    width: 44%;
    height: 54px;
    bottom: calc(100% - 4px);
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
    background: transparent;
    z-index: 7;
}

.ma-404-building--cathedral .ma-404-spire[b-ap4xj1c7dw] {
    position: absolute;
    bottom: 0;
    background: linear-gradient(180deg, #7b6d56 0%, #332c21 100%);
    border: 1px solid rgba(255,255,255,0.14);
    border-bottom: none;
    box-sizing: border-box;
    box-shadow: 0 0 1px rgba(0,0,0,0.35), inset 0 0 7px rgba(255,255,255,0.08);
}

.ma-404-building--cathedral .ma-404-spire-top[b-ap4xj1c7dw] {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 10px solid rgba(244,240,220,0.96);
    filter: drop-shadow(0 0 1px rgba(0,0,0,0.45));
}

.ma-404-building--thatch[b-ap4xj1c7dw] {
    background-image: linear-gradient(180deg, #7e6848 0%, #523e28 40%, #281810 100%);
}

.ma-404-building--short[b-ap4xj1c7dw] {
    background-image: linear-gradient(180deg, #3f3528 0%, #1d1813 100%);
}

.ma-404-building[b-ap4xj1c7dw]::before,
.ma-404-building[b-ap4xj1c7dw]::after {
    content: "";
    position: absolute;
    inset: 0.75rem 0.55rem auto;
    height: calc(100% - 1.25rem);
    opacity: 0.4;
}

.sky-day .ma-404-building[b-ap4xj1c7dw]::before,
.sky-day .ma-404-building[b-ap4xj1c7dw]::after { opacity: 0.08; }

/* Building variants for facade style */
.ma-404-building--tall[b-ap4xj1c7dw] {
    /* slightly lighter tint for taller buildings */
    background-image: linear-gradient(180deg, rgba(34,28,26,0.98), rgba(6,6,6,0.98));
}
.ma-404-building--short[b-ap4xj1c7dw] {
    background-image: linear-gradient(180deg, rgba(22,18,17,0.98), rgba(6,6,6,0.98));
}

.ma-404-roof[b-ap4xj1c7dw] {
    position: absolute;
    left: 0;
    width: 100%;
    height: 10px;
    background: linear-gradient(180deg, #9a8060 0%, #5a4230 100%);
    box-shadow: inset 0 -2px 4px rgba(0,0,0,0.5), 0 2px 5px rgba(0,0,0,0.3);
    border-radius: 0.1rem 0.1rem 0 0;
    z-index: 5;
}

.ma-404-chimney[b-ap4xj1c7dw] {
    position: absolute;
    background: linear-gradient(180deg, #3e2b1e 0%, #1f1710 100%);
    box-shadow: 0 0 1px rgba(0,0,0,0.7), inset 0 0 3px rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.18);
    z-index: 6;
}

.weather-fog .ma-404-building[b-ap4xj1c7dw],
.weather-fog .ma-404-roof[b-ap4xj1c7dw],
.weather-fog .ma-404-chimney[b-ap4xj1c7dw] {
    opacity: 0.68;
    filter: blur(0.5px) brightness(0.9);
}

.weather-storm .ma-404-building[b-ap4xj1c7dw],
.weather-storm .ma-404-roof[b-ap4xj1c7dw],
.weather-storm .ma-404-chimney[b-ap4xj1c7dw] {
    opacity: 0.86;
    filter: brightness(0.92) saturate(0.9);
}

/* Window grid overlay — horizontal stone courses rather than modern vertical columns */
.ma-404-building[b-ap4xj1c7dw]::after {
    inset: 0.5rem 0.4rem 0.5rem 0.4rem;
    background-image: repeating-linear-gradient(
        0deg,
        transparent 0px, transparent 9px,
        rgba(0,0,0,0.18) 9px, rgba(0,0,0,0.18) 10px
    ), linear-gradient(90deg, rgba(0,0,0,0.12) 0px, rgba(0,0,0,0.0) 4px, transparent 4px);
    background-size: 100% 10px, 24px 100%;
    background-position: 0 4px, 8px 0;
    mix-blend-mode: multiply;
}

/* small lit windows for night feel */
.sky-night .ma-404-building[b-ap4xj1c7dw]::after {
    background-image: repeating-linear-gradient(
        0deg,
        transparent 0px, transparent 9px,
        rgba(0,0,0,0.22) 9px, rgba(0,0,0,0.22) 10px
    ), linear-gradient(90deg, rgba(0,0,0,0.12) 0px, rgba(0,0,0,0.0) 4px, transparent 4px);
}

/* Ensure buildings never pick up animations from other rules */
.ma-404-building[b-ap4xj1c7dw], .ma-404-building *[b-ap4xj1c7dw] {
    animation: none !important;
    transition: none !important;
}

/* Debugging helper: toggle `.debug-outline` on building elements from the
   console to make movement visually obvious during troubleshooting. */
.ma-404-building.debug-outline[b-ap4xj1c7dw] {
    outline: 3px dashed rgba(255, 80, 80, 0.9) !important;
    box-shadow: 0 0 0 2px rgba(255, 80, 80, 0.18) inset !important;
}

.ma-404-overlay[b-ap4xj1c7dw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    background: rgba(10, 6, 2, 0.88);
    border: 1px solid var(--board-frame);
    border-radius: 0.75rem;
    color: var(--board-amber);
    width: min(100%);
}

.ma-404-status[b-ap4xj1c7dw] {
    margin: 0;
}

.ma-404-scene.is-running .ma-404-overlay[b-ap4xj1c7dw] {
    background: rgba(10, 6, 2, 0.72);
}

.ma-404-player.is-crashed[b-ap4xj1c7dw] {
    transition: top 2.4s cubic-bezier(0.18, 0.7, 0.15, 1), transform 2s ease-in, opacity 2s ease-in;
    transform: translateY(-50%) rotate(24deg) scale(0.95);
    opacity: 0.82;
}

.ma-404-player.is-crashed .ma-dirigible-bob[b-ap4xj1c7dw] {
    animation: ma-404-spinout-b-ap4xj1c7dw 0.22s linear infinite;
}

.ma-404-crash-particles[b-ap4xj1c7dw] {
    position: absolute;
    left: 1.15rem;
    bottom: 0.35rem;
    width: 3.4rem;
    height: 3rem;
    pointer-events: none;
    opacity: 0;
}

.ma-404-crash-particles span[b-ap4xj1c7dw] {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 50%;
    transform: translateX(-50%) scale(0.3);
    opacity: 0;
}

.ma-404-crash-particles.is-active[b-ap4xj1c7dw] {
    opacity: 1;
}

.ma-404-crash-particles.is-active span:nth-child(1)[b-ap4xj1c7dw] {
    background: radial-gradient(circle, rgba(255, 230, 120, 1) 0%, rgba(255, 145, 30, 0.95) 55%, rgba(120, 20, 0, 0) 100%);
    animation: ma-404-fire-burst-b-ap4xj1c7dw 0.7s ease-out infinite;
}

.ma-404-crash-particles.is-active span:nth-child(2)[b-ap4xj1c7dw] {
    background: radial-gradient(circle, rgba(255, 200, 80, 0.95) 0%, rgba(255, 90, 20, 0.85) 55%, rgba(120, 20, 0, 0) 100%);
    animation: ma-404-fire-burst-b-ap4xj1c7dw 0.9s ease-out infinite 0.14s;
}

.ma-404-crash-particles.is-active span:nth-child(3)[b-ap4xj1c7dw] {
    background: radial-gradient(circle, rgba(255, 150, 60, 0.95) 0%, rgba(180, 40, 10, 0.7) 60%, rgba(120, 20, 0, 0) 100%);
    animation: ma-404-fire-burst-b-ap4xj1c7dw 1s ease-out infinite 0.28s;
}

.ma-404-crash-particles.is-active span:nth-child(4)[b-ap4xj1c7dw],
.ma-404-crash-particles.is-active span:nth-child(5)[b-ap4xj1c7dw],
.ma-404-crash-particles.is-active span:nth-child(6)[b-ap4xj1c7dw] {
    background: radial-gradient(circle, rgba(90, 90, 90, 0.75) 0%, rgba(40, 40, 40, 0.45) 55%, rgba(20, 20, 20, 0) 100%);
}

.ma-404-crash-particles.is-active span:nth-child(4)[b-ap4xj1c7dw] {
    animation: ma-404-smoke-burst-b-ap4xj1c7dw 1.25s linear infinite;
}

.ma-404-crash-particles.is-active span:nth-child(5)[b-ap4xj1c7dw] {
    animation: ma-404-smoke-burst-b-ap4xj1c7dw 1.45s linear infinite 0.22s;
}

.ma-404-crash-particles.is-active span:nth-child(6)[b-ap4xj1c7dw] {
    animation: ma-404-smoke-burst-b-ap4xj1c7dw 1.65s linear infinite 0.44s;
}

.ma-weather-overlay[b-ap4xj1c7dw] { z-index: 1; opacity: 0; }
.weather-storm .ma-weather-overlay[b-ap4xj1c7dw] { opacity: 1; background: rgba(20, 10, 40, 0.3); }

.ma-rain-layer[b-ap4xj1c7dw],
.ma-snow-layer[b-ap4xj1c7dw] { z-index: 2; display: none; }
.weather-rain .ma-rain-layer[b-ap4xj1c7dw],
.weather-drizzle .ma-rain-layer[b-ap4xj1c7dw],
.weather-snow .ma-snow-layer[b-ap4xj1c7dw] { display: block; }

.ma-raindrop[b-ap4xj1c7dw] {
    position: absolute;
    top: -20px;
    width: 1.5px;
    height: 18px;
    background: rgba(180, 210, 240, 0.7);
    border-radius: 2px;
    animation: ma-rain-fall-b-ap4xj1c7dw linear infinite;
}

.weather-drizzle .ma-raindrop[b-ap4xj1c7dw] {
    height: 7px;
    width: 1px;
    background: rgba(180, 210, 240, 0.4);
}

.ma-snowflake[b-ap4xj1c7dw] {
    position: absolute;
    top: -10px;
    width: 5px;
    height: 5px;
    background: rgba(255, 255, 255, 0.85);
    border-radius: 50%;
    animation: ma-snow-fall-b-ap4xj1c7dw linear infinite;
}

.ma-snow-accumulation[b-ap4xj1c7dw] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 0;
    background: linear-gradient(to top, rgba(255,255,255,0.88), rgba(255,255,255,0.45), transparent);
    transition: height 10s ease;
}

.weather-snow .ma-snow-accumulation[b-ap4xj1c7dw] { height: 20px; }

.ma-fog-layer[b-ap4xj1c7dw] {
    z-index: 5;
    opacity: 0;
    background: radial-gradient(ellipse at 50% 80%, rgba(200,210,220,0.45), rgba(200,210,220,0.1) 60%, transparent 100%);
}

.weather-fog .ma-fog-layer[b-ap4xj1c7dw] {
    opacity: 1;
    animation: ma-fog-drift-b-ap4xj1c7dw 12s ease-in-out infinite alternate;
}

.ma-lightning-layer[b-ap4xj1c7dw] {
    z-index: 7;
    display: none;
}

.weather-storm .ma-lightning-layer[b-ap4xj1c7dw] {
    display: block;
    animation: ma-lightning-flash-b-ap4xj1c7dw 7s ease-in-out infinite;
}

.ma-bolt[b-ap4xj1c7dw] {
    position: absolute;
    top: 5%;
    opacity: 0;
    filter: drop-shadow(0 0 6px rgba(180, 210, 255, 0.9)) drop-shadow(0 0 14px rgba(140, 180, 255, 0.6));
}

.ma-bolt-1[b-ap4xj1c7dw] { left: 28%; width: 40px; height: 120px; animation: ma-bolt-strike-b-ap4xj1c7dw 7s ease-in-out infinite; }
.ma-bolt-2[b-ap4xj1c7dw] { left: 62%; width: 30px; height: 100px; animation: ma-bolt-strike-b-ap4xj1c7dw 7s ease-in-out infinite 1.1s; }

@keyframes ma-scroll-clouds-b-ap4xj1c7dw { from { transform: translateX(0); } to { transform: translateX(-200px); } }
@keyframes ma-scroll-skyline-b-ap4xj1c7dw { from { background-position-x: 0; } to { background-position-x: -800px; } }
@keyframes ma-scroll-sky-hi-b-ap4xj1c7dw { from { transform: translateX(0); } to { transform: translateX(-600px); } }
@keyframes ma-scroll-sky-lo-b-ap4xj1c7dw { from { transform: translateX(0); } to { transform: translateX(-800px); } }
@keyframes ma-dirigible-bob-b-ap4xj1c7dw { from { transform: translateY(0) rotate(0deg); } to { transform: translateY(-8px) rotate(0.6deg); } }
/* ma-witch-bob: rotation only — no translateY. The outer obstacle element is
   moved vertically by JS each frame; adding a CSS vertical offset here would
   shift the visual away from the collision hitbox. */
@keyframes ma-witch-bob-b-ap4xj1c7dw { from { transform: rotate(-3deg); } to { transform: rotate(2deg); } }
@keyframes ma-fly-birds-b-ap4xj1c7dw { from { right: -100px; transform: translateY(0); } 50% { transform: translateY(-15px); } to { right: 110%; transform: translateY(0); } }
@keyframes ma-flap-b-ap4xj1c7dw { from { transform: scaleY(1); } to { transform: scaleY(0.2); } }
@keyframes ma-spin-b-ap4xj1c7dw { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes ma-shoot-b-ap4xj1c7dw { 0% { transform: translate(0,0) rotate(-15deg); opacity: 0; } 2% { opacity: 1; } 6% { transform: translate(-300px, 80px) rotate(-15deg); opacity: 0; } 100% { opacity: 0; } }
@keyframes ma-rain-fall-b-ap4xj1c7dw { 0% { transform: translateY(-20px) rotate(10deg); opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { transform: translateY(calc(100vh + 20px)) rotate(10deg); opacity: 0; } }
@keyframes ma-snow-fall-b-ap4xj1c7dw { 0% { transform: translateY(-10px) translateX(0); opacity: 0; } 8% { opacity: 0.9; } 30% { transform: translateY(25%) translateX(12px); } 60% { transform: translateY(55%) translateX(-8px); } 85% { opacity: 0.85; } 100% { transform: translateY(100vh) translateX(10px); opacity: 0; } }
@keyframes ma-fog-drift-b-ap4xj1c7dw { from { background-position: 0% 50%; opacity: 0.7; } to { background-position: 100% 50%; opacity: 0.9; } }
@keyframes ma-lightning-flash-b-ap4xj1c7dw { 0%, 88%, 100% { background: rgba(200,220,255,0); } 90% { background: rgba(210,230,255,0.28); } 91% { background: rgba(200,220,255,0); } 93% { background: rgba(210,230,255,0.45); } 94% { background: rgba(200,220,255,0); } }
@keyframes ma-bolt-strike-b-ap4xj1c7dw { 0%, 88%, 100% { opacity: 0; } 90% { opacity: 1; } 91% { opacity: 0; } 93% { opacity: 0.9; } 94% { opacity: 0; } }
@keyframes ma-404-impact-pop-b-ap4xj1c7dw { 0% { transform: translateY(-50%) rotate(0deg) scale(1); } 100% { transform: translateY(-50%) rotate(-8deg) scale(1.04); } }
@keyframes ma-404-impact-shake-b-ap4xj1c7dw { 0%, 100% { transform: translateX(0); } 20% { transform: translateX(-10px); } 40% { transform: translateX(8px); } 60% { transform: translateX(-6px); } 80% { transform: translateX(4px); } }
@keyframes ma-404-spinout-b-ap4xj1c7dw { from { transform: rotate(0deg) scale(1); } to { transform: rotate(360deg) scale(0.94); } }
@keyframes ma-404-fire-burst-b-ap4xj1c7dw {
    0% { transform: translateX(-50%) translateY(0) scale(0.3); opacity: 0; }
    20% { opacity: 1; }
    100% { transform: translateX(-50%) translateY(-1.7rem) scale(1.25); opacity: 0; }
}

@keyframes ma-404-smoke-b-ap4xj1c7dw {
    0% { opacity: 0.4; transform: translateY(0) translateX(0) scale(0.6); }
    50% { opacity: 0.25; transform: translateY(-8px) translateX(-4px) scale(1.0); }
    100% { opacity: 0; transform: translateY(-16px) translateX(-8px) scale(1.4); }
}
@keyframes ma-404-smoke-burst-b-ap4xj1c7dw {
    0% { transform: translateX(-50%) translateY(0) scale(0.35); opacity: 0; }
    15% { opacity: 0.8; }
    100% { transform: translateX(-1rem) translateY(-2.4rem) scale(1.8); opacity: 0; }
}

@media (max-width: 991px) {
    .ma-404-hud[b-ap4xj1c7dw] {
        grid-template-columns: 1fr;
    }

    .ma-404-scoreboard[b-ap4xj1c7dw] {
        align-items: center;
    }

    .ma-404-scene[b-ap4xj1c7dw] {
        height: clamp(17rem, 38dvh, 22rem);
    }
}

@media (max-width: 767px) {
    .ma-404-control-block[b-ap4xj1c7dw],
    .ma-404-controls[b-ap4xj1c7dw],
    .ma-404-overlay[b-ap4xj1c7dw] {
        flex-direction: column;
        align-items: stretch;
    }

    .ma-404-slider-wrap[b-ap4xj1c7dw] {
        justify-content: space-between;
    }

    .ma-404-slider-wrap input[b-ap4xj1c7dw] {
        width: 100%;
    }
}

[data-bs-theme=light] .ma-404-meta[b-ap4xj1c7dw],
[data-bs-theme=light] .ma-404-controls[b-ap4xj1c7dw],
[data-bs-theme=light] .ma-404-scoreboard[b-ap4xj1c7dw],
[data-bs-theme=light] .ma-404-overlay[b-ap4xj1c7dw] {
    background: rgba(250, 242, 220, 0.92);
    border-color: var(--theme-light-accent);
    color: var(--theme-light-accent);
}
/* /Components/Pages/EventGroupPage.razor.rz.scp.css */
.columns[b-qevwlqbghm] {
    column-gap: 20px;
}

@media (min-width: 768px) {
    .columns[b-qevwlqbghm] {
        column-count: 2;
    }
}

@media (min-width: 992px) {
    .columns[b-qevwlqbghm] {
        column-count: 3;
    }
}

.text-only .badge[b-qevwlqbghm] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    color: rgba(var(--bs-body-bg-rgb),1) !important
}
/* /Components/Pages/FAQIndexPage.razor.rz.scp.css */
/* Sort dropdown styling */
.sort-wrapper[b-2jzm8ccypg] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

/* small decorative button left of select (non-interactive, visually groups controls) */
.sort-btn[b-2jzm8ccypg] {
    border-radius: 0.5rem;
    padding: 0.28rem 0.5rem;
    min-width: 3rem;
    height: calc(1.5rem + 0.6rem);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--bs-body-color);
    background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.02));
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

/* prettier select */
.sort-select[b-2jzm8ccypg] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0.28rem 1.8rem 0.28rem 0.6rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(0,0,0,0.08);
    background-color: var(--bs-body-bg);
    box-shadow: 0 4px 10px rgba(16,24,40,0.02);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%23343a40' d='M6 8L0 0h12z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 0.6rem center;
    background-size: 0.65rem auto;
    transition: border-color .15s ease, box-shadow .15s ease, transform .06s ease;
    cursor: pointer;
}

/* focus state */
.sort-select:focus[b-2jzm8ccypg] {
    outline: none;
    border-color: rgba(13,110,253,0.25);
    box-shadow: 0 4px 12px rgba(13,110,253,0.08);
    transform: translateY(-1px);
}

/* smaller on very small screens */
@media (max-width: 420px) {
    .sort-wrapper .sort-btn span[b-2jzm8ccypg] { display:none; }
    .sort-select[b-2jzm8ccypg] { font-size: 0.9rem; padding-right: 1.6rem; }
}

/* ── Vertical split-flap side board ── */
.ma-side-board[b-2jzm8ccypg] {
    background: var(--board-bg);
    border: 2px solid var(--board-frame);
    border-top: 4px solid var(--board-frame);
    box-shadow: 0 6px 28px rgba(0,0,0,0.55);
    overflow: hidden;
    margin-top: 8px;
}

@media (max-width: 991px) {
    .ma-side-board[b-2jzm8ccypg] {
        margin-top: 20px;
    }
}

.ma-side-board-header[b-2jzm8ccypg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--theme-dark-btn-bg);
    padding: 6px 10px;
    border-bottom: 1px solid rgba(242,194,75,0.3);
}

.ma-side-board-title[b-2jzm8ccypg] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    color: #000;
    text-transform: uppercase;
}

.ma-side-board-lamps[b-2jzm8ccypg] {
    display: flex;
    flex-direction: row;
    gap: 5px;
    align-items: center;
}

.ma-side-rows[b-2jzm8ccypg] {
    display: flex;
    flex-direction: column;
}

.ma-side-row[b-2jzm8ccypg] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    padding: 5px 8px 5px 10px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    width: 100%;
    background: transparent;
    border-bottom: 1px solid var(--board-flap-line, rgba(255,255,255,0.08));
    border-left: 3px solid transparent;
    transition: background 120ms ease, border-left-color 120ms ease;
    text-align: left;
    overflow: hidden;
    min-width: 0;
    box-sizing: border-box;
}

.ma-side-row:last-child[b-2jzm8ccypg] {
    border-bottom: none;
}

.ma-side-row:hover[b-2jzm8ccypg],
.ma-side-row:focus-visible[b-2jzm8ccypg] {
    background: rgba(184,134,11,0.14);
    border-left-color: rgba(184,134,11,0.5);
    outline: none;
}

.ma-side-row--active[b-2jzm8ccypg] {
    background: rgba(184,134,11,0.10);
    border-left-color: var(--board-amber);
    box-shadow: inset 3px 0 8px rgba(184,134,11,0.15);
}

/* Active dot indicator — replaces badge */
.ma-side-active-dot[b-2jzm8ccypg] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--board-amber);
    box-shadow: 0 0 6px var(--board-amber);
    flex-shrink: 0;
    animation: ma-dot-pulse-b-2jzm8ccypg 1.4s ease-in-out infinite;
}

@keyframes ma-dot-pulse-b-2jzm8ccypg {
    0%, 100% { opacity: 1; box-shadow: 0 0 6px var(--board-amber); }
    50%       { opacity: 0.4; box-shadow: 0 0 2px var(--board-amber); }
}

/* Flap row container — full width now badge is gone */
.ma-side-board .ma-col-flaps[b-2jzm8ccypg] {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}

/* Flap base styles — must redeclare here since Navmenu.razor.css is isolated */
/* 12px wide × 24px tall gives ~19 chars in a col-3 sidebar after badge */
.ma-side-board .ma-flap[b-2jzm8ccypg] {
    background: var(--board-flap);
    border-right: 1px solid var(--board-bg);
    color: transparent;
    display: flex;
    flex-direction: column;
    height: 24px;
    width: 12px;
    position: relative;
    flex-shrink: 0;
}

    .ma-side-board .ma-flap[b-2jzm8ccypg]::before {
        background: var(--board-flap);
        border-bottom: 1px solid rgba(255,255,255,0.12);
        content: attr(data-char);
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 15px;
        line-height: 24px;
        font-weight: 600 !important;
        height: 12px;
        overflow: hidden;
        text-align: center;
        width: 100%;
        color: var(--board-amber);
        text-shadow: 0 0 8px var(--board-amber-dim);
        z-index: 2;
        display: block;
    }

    .ma-side-board .ma-flap[b-2jzm8ccypg]::after {
        background: var(--board-flap-line);
        content: attr(data-char);
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 15px;
        font-weight: 600 !important;
        line-height: 24px;
        height: 24px;
        margin-top: -12px;
        overflow: hidden;
        text-align: center;
        width: 100%;
        color: var(--board-amber);
        opacity: 0.7;
        text-shadow: 0 0 5px var(--board-amber-dim);
        z-index: 1;
        display: block;
    }

.ma-side-board .ma-flap[data-char=" "][b-2jzm8ccypg]::before,
.ma-side-board .ma-flap[data-char=" "][b-2jzm8ccypg]::after {
    content: '\00a0';
}

.ma-side-board .ma-flap.is-cycling[b-2jzm8ccypg]::before,
.ma-side-board .ma-flap.is-cycling[b-2jzm8ccypg]::after {
    color: var(--board-amber);
    text-shadow: 0 0 14px var(--board-amber);
    animation: ma-cycle 90ms linear infinite;
}

/* ── Light theme overrides — matches nav board light treatment ── */
[data-bs-theme=light] .ma-side-board[b-2jzm8ccypg] {
    background: var(--theme-light-menu-bg);
    border-color: var(--theme-light-accent);
    border-top-color: var(--theme-light-accent);
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}

[data-bs-theme=light] .ma-side-board-header[b-2jzm8ccypg] {
    background: var(--theme-light-accent);
    border-bottom-color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-side-board-title[b-2jzm8ccypg] {
    color: #fff;
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-2jzm8ccypg] {
    background: var(--theme-light-menu-bg);
    border-right-color: rgba(120,82,10,0.12);
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-2jzm8ccypg]::before {
    background: var(--theme-light-menu-bg);
    border-bottom-color: rgba(120,82,10,0.25);
    color: var(--theme-light-accent);
    text-shadow: none;
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-2jzm8ccypg]::after {
    background: var(--theme-light-menu-bg);
    color: var(--theme-light-accent);
    text-shadow: none;
    opacity: 0.55;
}

[data-bs-theme=light] .ma-side-board .ma-flap.is-cycling[b-2jzm8ccypg]::before,
[data-bs-theme=light] .ma-side-board .ma-flap.is-cycling[b-2jzm8ccypg]::after {
    color: var(--theme-light-accent);
    text-shadow: none;
}

[data-bs-theme=light] .ma-side-row[b-2jzm8ccypg] {
    border-bottom-color: rgba(120,82,10,0.22);
    border-left-color: transparent;
}

[data-bs-theme=light] .ma-side-row:hover[b-2jzm8ccypg],
[data-bs-theme=light] .ma-side-row:focus-visible[b-2jzm8ccypg] {
    background: rgba(120,82,10,0.07);
    border-left-color: rgba(120,82,10,0.4);
}

[data-bs-theme=light] .ma-side-row--active[b-2jzm8ccypg] {
    background: rgba(120,82,10,0.10);
    border-left-color: var(--theme-light-accent);
    box-shadow: inset 3px 0 8px rgba(120,82,10,0.12);
}

[data-bs-theme=light] .ma-side-active-dot[b-2jzm8ccypg] {
    background: var(--theme-light-accent);
    box-shadow: 0 0 6px rgba(120,82,10,0.5);
}

/* ── Text-only mode ── */
.text-only .ma-side-board[b-2jzm8ccypg] {
    background: transparent;
    border: 1px solid var(--bs-border-color);
    border-top-width: 1px;
    box-shadow: none;
}

.text-only .ma-side-board-header[b-2jzm8ccypg] {
    background: var(--bs-secondary-bg);
    border-bottom-color: var(--bs-border-color);
}

.text-only .ma-side-board-title[b-2jzm8ccypg] {
    color: var(--bs-body-color);
    font-family: var(--bs-font-sans-serif);
    font-size: 0.7rem;
    letter-spacing: 0;
}

.text-only .ma-side-row[b-2jzm8ccypg] {
    border-left: none;
    border-bottom-color: var(--bs-border-color);
    padding: 6px 10px;
}

.text-only .ma-side-row:hover[b-2jzm8ccypg] {
    background: var(--bs-secondary-bg);
}

.text-only .ma-side-row--active[b-2jzm8ccypg] {
    background: var(--bs-secondary-bg);
    border-left: 3px solid var(--theme-primary);
    box-shadow: none;
}

/* Hide flap cells and chrome; show plain text from data-dest */
.text-only .ma-side-board .ma-flap[b-2jzm8ccypg],
.text-only .ma-side-board .ma-side-active-dot[b-2jzm8ccypg],
.text-only .ma-side-board .ma-side-board-lamps[b-2jzm8ccypg] {
    display: none;
}

.text-only .ma-side-board .ma-col-flaps[b-2jzm8ccypg]::after {
    content: attr(data-dest);
    font-family: var(--bs-font-sans-serif);
    font-size: 0.9rem;
    color: var(--bs-body-color);
    text-transform: capitalize;
    letter-spacing: 0;
}
/* /Components/Pages/FAQPage.razor.rz.scp.css */
.card-body[b-r436w8n9yv] {
    padding:2em;
}


@media (min-width: 576px) {
    .card-body[b-r436w8n9yv] {
        margin-top: 2.5em;
        margin-bottom: 2.5em;
    }
}
/* /Components/Pages/GalaDinnerTicketPage.razor.rz.scp.css */
:root[b-oqiq6hmuug] {
    /* Acts as a fallback if global not applied yet (scoped build may still work).
       Safe to keep; global one will override if earlier. */
    --description-height: 320px;
}

.list-group .list-group-item[b-oqiq6hmuug] {
    background-color: transparent;
}

.list-group[b-oqiq6hmuug] {
    margin-right: 5px;
    margin-left: 5px;
}

.card-header[b-oqiq6hmuug] {
    padding-top: 30px;
    padding-left: 35px;
    padding-right: 35px;
    margin-right: 5px;
    margin-left: 5px;
}

.description-collapsed[b-oqiq6hmuug] {
    display: -webkit-box;
    -webkit-line-clamp: 10; /* Adjust lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: relative;
    transition: max-height .35s ease;
}

.description-expanded[b-oqiq6hmuug] {
    max-height: none;
    transition: max-height .35s ease;
}

label[b-oqiq6hmuug] {
    z-index: 1;
}

.input-group button:focus[b-oqiq6hmuug], .input-group button[b-oqiq6hmuug] {
    z-index: 1;
}

.text-only .alert-primary[b-oqiq6hmuug], .text-only .alert-warning[b-oqiq6hmuug] {
    color: var(--bs-body-color);
    background: var(--bs-bg-color);
    --bs-alert-border-color: var(--bs-border-color-translucent);
}

.list-group.list-group-flush .list-group-item[b-oqiq6hmuug] {
    border-bottom: 0px !important;
    padding-top: 0px;
}

    .list-group.list-group-flush .list-group-item:first-of-type[b-oqiq6hmuug] {
        border-bottom: 0px !important;
        padding-top: 5px;
    }

h1[b-oqiq6hmuug] {
    margin-bottom: 0.3em !important;
}
/* /Components/Pages/GuestsPage.razor.rz.scp.css */
.guest-url[b-52rgv0wsuo] {
    word-break: break-all;

}

.card-body[b-52rgv0wsuo] {
    padding-top:1em;
}
/* /Components/Pages/KlatchPage.razor.rz.scp.css */
.card-body p[b-9gskhs2rq7] {
        margin-bottom: 0;
    }

.columns[b-9gskhs2rq7] {
    column-gap: 20px;
}

@media (min-width: 768px) {
    .columns[b-9gskhs2rq7] {
        column-count: 2;
    }
}

@media (min-width: 992px) {
    .columns[b-9gskhs2rq7] {
        column-count: 3;
    }
}

.member-row[b-9gskhs2rq7] {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.badge[b-9gskhs2rq7] {
    min-width: 65px;
    flex-shrink: 0;
}

.badge-name-indent[b-9gskhs2rq7] {
    flex: 1 1 0;
    min-width: 0;
    /* Indent only wrapped lines */
    text-indent: 0;
    padding-left: 0;
    margin-left: 8px; /* space between badge and name */
}
/* /Components/Pages/MemberListPage.razor.rz.scp.css */
.columns[b-r20qdcw39w] {
    column-gap: 20px;
}

@media (min-width: 768px) {
    .columns[b-r20qdcw39w] {
        column-count: 2;
    }
}

@media (min-width: 992px) {
    .columns[b-r20qdcw39w] {
        column-count: 3;
    }
}

.member-row[b-r20qdcw39w] {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.badge[b-r20qdcw39w] {
    min-width: 65px;
    flex-shrink: 0;
}

.badge-name-indent[b-r20qdcw39w] {
    flex: 1 1 0;
    min-width: 0;
    /* Indent only wrapped lines */
    text-indent: 0;
    padding-left: 0;
    margin-left: 8px; /* space between badge and name */
}
/* /Components/Pages/NewsIndexPage.razor.rz.scp.css */
/* Sort dropdown styling (mirrors FAQIndexPage) */
.sort-wrapper[b-xzmnsb5ue1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.sort-btn[b-xzmnsb5ue1] {
    border-radius: 0.5rem;
    padding: 0.28rem 0.5rem;
    min-width: 3rem;
    height: calc(1.5rem + 0.6rem);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--bs-body-color);
    background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.02));
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

.sort-select[b-xzmnsb5ue1] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0.28rem 1.8rem 0.28rem 0.6rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(0,0,0,0.08);
    background-color: var(--bs-body-bg);
    box-shadow: 0 4px 10px rgba(16,24,40,0.02);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%23343a40' d='M6 8L0 0h12z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 0.6rem center;
    background-size: 0.65rem auto;
    transition: border-color .15s ease, box-shadow .15s ease, transform .06s ease;
    cursor: pointer;
}

.sort-select:focus[b-xzmnsb5ue1] {
    outline: none;
    border-color: rgba(13,110,253,0.25);
    box-shadow: 0 4px 12px rgba(13,110,253,0.08);
    transform: translateY(-1px);
}

@media (max-width: 420px) {
    .sort-wrapper .sort-btn span[b-xzmnsb5ue1] { display:none; }
    .sort-select[b-xzmnsb5ue1] { font-size: 0.9rem; padding-right: 1.6rem; }
}

/* ── Vertical split-flap side board ── */
.ma-side-board[b-xzmnsb5ue1] {
    background: var(--board-bg);
    border: 2px solid var(--board-frame);
    border-top: 4px solid var(--board-frame);
    box-shadow: 0 6px 28px rgba(0,0,0,0.55);
    overflow: hidden;
    margin-top: 8px;
}

@media (max-width: 991px) {
    .ma-side-board[b-xzmnsb5ue1] {
        margin-top: 20px;
    }
}

.ma-side-board-header[b-xzmnsb5ue1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--theme-dark-btn-bg);
    padding: 6px 10px;
    border-bottom: 1px solid rgba(242,194,75,0.3);
}

.ma-side-board-title[b-xzmnsb5ue1] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    color: #000;
    text-transform: uppercase;
}

.ma-side-board-lamps[b-xzmnsb5ue1] {
    display: flex;
    flex-direction: row;
    gap: 5px;
    align-items: center;
}

.ma-side-rows[b-xzmnsb5ue1] {
    display: flex;
    flex-direction: column;
}

.ma-side-row[b-xzmnsb5ue1] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    padding: 5px 8px 5px 10px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    width: 100%;
    background: transparent;
    border-bottom: 1px solid var(--board-flap-line, rgba(255,255,255,0.08));
    border-left: 3px solid transparent;
    transition: background 120ms ease, border-left-color 120ms ease;
    text-align: left;
    overflow: hidden;
    min-width: 0;
    box-sizing: border-box;
}

.ma-side-row:last-child[b-xzmnsb5ue1] {
    border-bottom: none;
}

.ma-side-row:hover[b-xzmnsb5ue1],
.ma-side-row:focus-visible[b-xzmnsb5ue1] {
    background: rgba(184,134,11,0.14);
    border-left-color: rgba(184,134,11,0.5);
    outline: none;
}

.ma-side-row--active[b-xzmnsb5ue1] {
    background: rgba(184,134,11,0.10);
    border-left-color: var(--board-amber);
    box-shadow: inset 3px 0 8px rgba(184,134,11,0.15);
}

/* Active dot indicator — replaces badge */
.ma-side-active-dot[b-xzmnsb5ue1] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--board-amber);
    box-shadow: 0 0 6px var(--board-amber);
    flex-shrink: 0;
    animation: ma-dot-pulse-b-xzmnsb5ue1 1.4s ease-in-out infinite;
}

@keyframes ma-dot-pulse-b-xzmnsb5ue1 {
    0%, 100% { opacity: 1; box-shadow: 0 0 6px var(--board-amber); }
    50%       { opacity: 0.4; box-shadow: 0 0 2px var(--board-amber); }
}

/* Flap row container — full width now badge is gone */
.ma-side-board .ma-col-flaps[b-xzmnsb5ue1] {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}

/* Flap base styles — must redeclare here since Navmenu.razor.css is isolated */
/* 12px wide × 24px tall gives ~19 chars in a col-3 sidebar after badge */
.ma-side-board .ma-flap[b-xzmnsb5ue1] {
    background: var(--board-flap);
    border-right: 1px solid var(--board-bg);
    color: transparent;
    display: flex;
    flex-direction: column;
    height: 24px;
    width: 12px;
    position: relative;
    flex-shrink: 0;
}

    .ma-side-board .ma-flap[b-xzmnsb5ue1]::before {
        background: var(--board-flap);
        border-bottom: 1px solid rgba(255,255,255,0.12);
        content: attr(data-char);
        font-weight: 600 !important;
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 15px;
        line-height: 24px;
        height: 12px;
        overflow: hidden;
        text-align: center;
        width: 100%;
        color: var(--board-amber);
        text-shadow: 0 0 8px var(--board-amber-dim);
        z-index: 2;
        display: block;
    }

    .ma-side-board .ma-flap[b-xzmnsb5ue1]::after {
        background: var(--board-flap-line);
        content: attr(data-char);
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 15px;
        line-height: 24px;
        height: 24px;
        margin-top: -12px;
        overflow: hidden;
        text-align: center;
        width: 100%;
        font-weight: 600 !important;
        color: var(--board-amber);
        opacity: 0.7;
        text-shadow: 0 0 5px var(--board-amber-dim);
        z-index: 1;
        display: block;
    }

.ma-side-board .ma-flap[data-char=" "][b-xzmnsb5ue1]::before,
.ma-side-board .ma-flap[data-char=" "][b-xzmnsb5ue1]::after {
    content: '\00a0';
}

.ma-side-board .ma-flap.is-cycling[b-xzmnsb5ue1]::before,
.ma-side-board .ma-flap.is-cycling[b-xzmnsb5ue1]::after {
    color: var(--board-amber);
    text-shadow: 0 0 14px var(--board-amber);
    animation: ma-cycle 90ms linear infinite;
}

/* ── Light theme overrides — matches nav board light treatment ── */
[data-bs-theme=light] .ma-side-board[b-xzmnsb5ue1] {
    background: var(--theme-light-menu-bg);
    border-color: var(--theme-light-accent);
    border-top-color: var(--theme-light-accent);
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}

[data-bs-theme=light] .ma-side-board-header[b-xzmnsb5ue1] {
    background: var(--theme-light-accent);
    border-bottom-color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-side-board-title[b-xzmnsb5ue1] {
    color: #fff;
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-xzmnsb5ue1] {
    background: var(--theme-light-menu-bg);
    border-right-color: rgba(120,82,10,0.12);
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-xzmnsb5ue1]::before {
    background: var(--theme-light-menu-bg);
    border-bottom-color: rgba(120,82,10,0.25);
    color: var(--theme-light-accent);
    text-shadow: none;
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-xzmnsb5ue1]::after {
    background: var(--theme-light-menu-bg);
    color: var(--theme-light-accent);
    text-shadow: none;
    opacity: 0.55;
}

[data-bs-theme=light] .ma-side-board .ma-flap.is-cycling[b-xzmnsb5ue1]::before,
[data-bs-theme=light] .ma-side-board .ma-flap.is-cycling[b-xzmnsb5ue1]::after {
    color: var(--theme-light-accent);
    text-shadow: none;
}

[data-bs-theme=light] .ma-side-row[b-xzmnsb5ue1] {
    border-bottom-color: rgba(120,82,10,0.22);
    border-left-color: transparent;
}

[data-bs-theme=light] .ma-side-row:hover[b-xzmnsb5ue1],
[data-bs-theme=light] .ma-side-row:focus-visible[b-xzmnsb5ue1] {
    background: rgba(120,82,10,0.07);
    border-left-color: rgba(120,82,10,0.4);
}

[data-bs-theme=light] .ma-side-row--active[b-xzmnsb5ue1] {
    background: rgba(120,82,10,0.10);
    border-left-color: var(--theme-light-accent);
    box-shadow: inset 3px 0 8px rgba(120,82,10,0.12);
}

[data-bs-theme=light] .ma-side-active-dot[b-xzmnsb5ue1] {
    background: var(--theme-light-accent);
    box-shadow: 0 0 6px rgba(120,82,10,0.5);
}

/* ── Text-only mode ── */
.text-only .ma-side-board[b-xzmnsb5ue1] {
    background: transparent;
    border: 1px solid var(--bs-border-color);
    border-top-width: 1px;
    box-shadow: none;
}

.text-only .ma-side-board-header[b-xzmnsb5ue1] {
    background: var(--bs-secondary-bg);
    border-bottom-color: var(--bs-border-color);
}

.text-only .ma-side-board-title[b-xzmnsb5ue1] {
    color: var(--bs-body-color);
    font-family: var(--bs-font-sans-serif);
    font-size: 0.7rem;
    letter-spacing: 0;
}

.text-only .ma-side-row[b-xzmnsb5ue1] {
    border-left: none;
    border-bottom-color: var(--bs-border-color);
    padding: 6px 10px;
}

.text-only .ma-side-row:hover[b-xzmnsb5ue1] {
    background: var(--bs-secondary-bg);
}

.text-only .ma-side-row--active[b-xzmnsb5ue1] {
    background: var(--bs-secondary-bg);
    border-left: 3px solid var(--theme-primary);
    box-shadow: none;
}

/* Hide flap cells and chrome; show plain text from data-dest */
.text-only .ma-side-board .ma-flap[b-xzmnsb5ue1],
.text-only .ma-side-board .ma-side-active-dot[b-xzmnsb5ue1],
.text-only .ma-side-board .ma-side-board-lamps[b-xzmnsb5ue1] {
    display: none;
}

.text-only .ma-side-board .ma-col-flaps[b-xzmnsb5ue1]::after {
    content: attr(data-dest);
    font-family: var(--bs-font-sans-serif);
    font-size: 0.9rem;
    color: var(--bs-body-color);
    text-transform: capitalize;
    letter-spacing: 0;
}

.text-only .sort-btn[b-xzmnsb5ue1] {
    background: none;
    box-shadow: none;
    border: 0px solid var(--bs-body-color);
    color: var(--bs-body-color);
    min-width: 2.4rem;
    padding: 0.25rem 0.5rem;
}

.text-only .sort-btn i[b-xzmnsb5ue1] {
    filter: none;
}
/* /Components/Pages/NewsPage.razor.rz.scp.css */
.card-body[b-uvmnunj7y4] {
    padding: 2em;
}


@media (min-width: 576px) {
    .card-body[b-uvmnunj7y4] {
        margin-top: 2.5em;
        margin-bottom: 2.5em;
    }
}
/* /Components/Pages/ProductPage.razor.rz.scp.css */
:root[b-u53jcgyywg] {
    /* Acts as a fallback if global not applied yet (scoped build may still work).
       Safe to keep; global one will override if earlier. */
    --description-height: 320px;
}

.list-group .list-group-item[b-u53jcgyywg] {
    background-color: transparent;
    
}

.list-group[b-u53jcgyywg] {
    margin-right: 5px;
    margin-left:5px;
}

.card-header[b-u53jcgyywg] {
    padding-top: 30px;
    padding-left: 35px;
    padding-right: 35px;
    margin-right: 5px;
    margin-left: 5px;
}

.description-collapsed[b-u53jcgyywg] {
    display: -webkit-box;
    -webkit-line-clamp: 10; /* Adjust lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: relative;
    transition: max-height .35s ease;
}

.description-expanded[b-u53jcgyywg] {
    max-height: none;
    transition: max-height .35s ease;
}

label[b-u53jcgyywg] {
    z-index:1;
}

.input-group button:focus[b-u53jcgyywg], .input-group button[b-u53jcgyywg] {
    z-index: 1;
}

.text-only .alert-primary[b-u53jcgyywg], .text-only .alert-warning[b-u53jcgyywg] {
    color: var(--bs-body-color);
    background: var(--bs-bg-color);
    --bs-alert-border-color: var(--bs-border-color-translucent);
}

.list-group.list-group-flush .list-group-item[b-u53jcgyywg] {
    border-bottom: 0px !important;
    padding-top:0px;
}

.list-group.list-group-flush .list-group-item:first-of-type[b-u53jcgyywg] {
    border-bottom: 0px !important;
    padding-top: 5px;
}

h1[b-u53jcgyywg] {
    margin-bottom:0.3em !important;
}


.pretty-border-simple.sm[b-u53jcgyywg] {
  position: absolute;
  inset: 0;            /* stretch over the card if that�s desired */
  z-index: 1;          /* above the carousel�s z-index:0 */
  pointer-events: none;/* keep border non-interactive */
}
/* /Components/Pages/ProgrammePage.razor.rz.scp.css */
.text-only .nav-item .nav-link.active[b-q9mjot9fap]
 {
    color: var(--bs-body-bg) !important;
    background: var(--bs-emphasis-color) !important;
}

.text-only .nav-item .nav-link:hover[b-q9mjot9fap] {
    color: var(--bs-emphasis-color) !important;
}

.text-only .nav-item .nav-link.active:hover[b-q9mjot9fap] {
    color: var(--bs-body-bg) !important;
}
/* /Components/Pages/QuizPage.razor.rz.scp.css */
.card-body p[b-nj7wqwfxkv] {
    margin-bottom: 0;
}

.columns[b-nj7wqwfxkv] {
    column-gap: 20px;
}

@media (min-width: 768px) {
    .columns[b-nj7wqwfxkv] {
        column-count: 2;
    }
}

@media (min-width: 992px) {
    .columns[b-nj7wqwfxkv] {
        column-count: 3;
    }
}

.member-row[b-nj7wqwfxkv] {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.badge[b-nj7wqwfxkv] {
    min-width: 65px;
    flex-shrink: 0;
}

.badge-name-indent[b-nj7wqwfxkv] {
    flex: 1 1 0;
    min-width: 0;
    /* Indent only wrapped lines */
    text-indent: 0;
    padding-left: 0;
    margin-left: 8px; /* space between badge and name */
}

.quiz-teams-section[b-nj7wqwfxkv],
.quiz-members-section[b-nj7wqwfxkv],
.quiz-signup-form[b-nj7wqwfxkv],
.quiz-team-create[b-nj7wqwfxkv] {
    margin-top: 1rem;
}

.quiz-team[b-nj7wqwfxkv] {
    background-color: var(--bs-body-bg);
}

.quiz-team-members li[b-nj7wqwfxkv] {
    border-bottom: 1px dotted var(--bs-border-color-translucent);
    padding-bottom: .35rem;
}

.quiz-team-members li:last-child[b-nj7wqwfxkv] {
    border-bottom: 0;
    padding-bottom: 0;
}

.quiz-member-list li[b-nj7wqwfxkv] {
    border-bottom: 1px dotted var(--bs-border-color-translucent);
    padding-bottom: .35rem;
}

.quiz-member-list li:last-child[b-nj7wqwfxkv] {
    border-bottom: 0;
    padding-bottom: 0;
}
/* /Components/Pages/StandardPage.razor.rz.scp.css */
@media (max-width: 991px) {
    .card.links[b-7kasneb7xg] {
        margin-top: 20px;
    }
}

/* ── Vertical split-flap side board ── */
.ma-side-board[b-7kasneb7xg] {
    background: var(--board-bg);
    border: 2px solid var(--board-frame);
    border-top: 4px solid var(--board-frame);
    box-shadow: 0 6px 28px rgba(0,0,0,0.55);
    overflow: hidden;
    margin-top: 8px;
}

@media (max-width: 991px) {
    .ma-side-board[b-7kasneb7xg] {
        margin-top: 20px;
    }
}

.ma-side-board-header[b-7kasneb7xg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--theme-dark-btn-bg);
    padding: 6px 10px;
    border-bottom: 1px solid rgba(242,194,75,0.3);
}

.ma-side-board-title[b-7kasneb7xg] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    color: #000;
    text-transform: uppercase;
}

.ma-side-board-lamps[b-7kasneb7xg] {
    display: flex;
    flex-direction: row;
    gap: 5px;
    align-items: center;
}

.ma-side-rows[b-7kasneb7xg] {
    display: flex;
    flex-direction: column;
}

.ma-side-row[b-7kasneb7xg] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    padding: 5px 8px 5px 10px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    width: 100%;
    background: transparent;
    border-bottom: 1px solid var(--board-flap-line, rgba(255,255,255,0.08));
    border-left: 3px solid transparent;
    transition: background 120ms ease, border-left-color 120ms ease;
    text-align: left;
    overflow: hidden;
    min-width: 0;
    box-sizing: border-box;
}

.ma-side-row:last-child[b-7kasneb7xg] {
    border-bottom: none;
}

.ma-side-row:hover[b-7kasneb7xg],
.ma-side-row:focus-visible[b-7kasneb7xg] {
    background: rgba(184,134,11,0.14);
    border-left-color: rgba(184,134,11,0.5);
    outline: none;
}

.ma-side-row--active[b-7kasneb7xg] {
    background: rgba(184,134,11,0.10);
    border-left-color: var(--board-amber);
    box-shadow: inset 3px 0 8px rgba(184,134,11,0.15);
}

/* Active dot indicator — replaces badge */
.ma-side-active-dot[b-7kasneb7xg] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--board-amber);
    box-shadow: 0 0 6px var(--board-amber);
    flex-shrink: 0;
    animation: ma-dot-pulse-b-7kasneb7xg 1.4s ease-in-out infinite;
}

@keyframes ma-dot-pulse-b-7kasneb7xg {
    0%, 100% { opacity: 1; box-shadow: 0 0 6px var(--board-amber); }
    50%       { opacity: 0.4; box-shadow: 0 0 2px var(--board-amber); }
}

/* Flap row container — full width now badge is gone */
.ma-side-board .ma-col-flaps[b-7kasneb7xg] {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}

/* Flap base styles — must redeclare here since Navmenu.razor.css is isolated */
/* 12px wide × 24px tall gives ~19 chars in a col-3 sidebar after badge */
.ma-side-board .ma-flap[b-7kasneb7xg] {
    background: var(--board-flap);
    border-right: 1px solid var(--board-bg);
    color: transparent;
    display: flex;
    flex-direction: column;
    height: 24px;
    width: 12px;
    position: relative;
    flex-shrink: 0;
}

    .ma-side-board .ma-flap[b-7kasneb7xg]::before {
        background: var(--board-flap);
        border-bottom: 1px solid rgba(255,255,255,0.12);
        content: attr(data-char);
        font-weight: 600 !important;
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 15px;
        line-height: 24px;
        height: 12px;
        overflow: hidden;
        text-align: center;
        width: 100%;
        color: var(--board-amber);
        text-shadow: 0 0 8px var(--board-amber-dim);
        z-index: 2;
        display: block;
    }

    .ma-side-board .ma-flap[b-7kasneb7xg]::after {
        background: var(--board-flap-line);
        content: attr(data-char);
        font-family: 'Share Tech Mono', 'Courier New', monospace;
        font-size: 15px;
        font-weight: 600 !important;
        line-height: 24px;
        height: 24px;
        margin-top: -12px;
        overflow: hidden;
        text-align: center;
        width: 100%;
        color: var(--board-amber);
        opacity: 0.7;
        text-shadow: 0 0 5px var(--board-amber-dim);
        z-index: 1;
        display: block;
    }

.ma-side-board .ma-flap[data-char=" "][b-7kasneb7xg]::before,
.ma-side-board .ma-flap[data-char=" "][b-7kasneb7xg]::after {
    content: '\00a0';
}

.ma-side-board .ma-flap.is-cycling[b-7kasneb7xg]::before,
.ma-side-board .ma-flap.is-cycling[b-7kasneb7xg]::after {
    color: var(--board-amber);
    text-shadow: 0 0 14px var(--board-amber);
    animation: ma-cycle 90ms linear infinite;
}

/* ── Light theme overrides — matches nav board light treatment ── */
[data-bs-theme=light] .ma-side-board[b-7kasneb7xg] {
    background: var(--theme-light-menu-bg);
    border-color: var(--theme-light-accent);
    border-top-color: var(--theme-light-accent);
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}

[data-bs-theme=light] .ma-side-board-header[b-7kasneb7xg] {
    background: var(--theme-light-accent);
    border-bottom-color: var(--theme-light-accent);
}

[data-bs-theme=light] .ma-side-board-title[b-7kasneb7xg] {
    color: #fff;
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-7kasneb7xg] {
    background: var(--theme-light-menu-bg);
    border-right-color: rgba(120,82,10,0.12);
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-7kasneb7xg]::before {
    background: var(--theme-light-menu-bg);
    border-bottom-color: rgba(120,82,10,0.25);
    color: var(--theme-light-accent);
    text-shadow: none;
}

[data-bs-theme=light] .ma-side-board .ma-flap[b-7kasneb7xg]::after {
    background: var(--theme-light-menu-bg);
    color: var(--theme-light-accent);
    text-shadow: none;
    opacity: 0.55;
}

[data-bs-theme=light] .ma-side-board .ma-flap.is-cycling[b-7kasneb7xg]::before,
[data-bs-theme=light] .ma-side-board .ma-flap.is-cycling[b-7kasneb7xg]::after {
    color: var(--theme-light-accent);
    text-shadow: none;
}

[data-bs-theme=light] .ma-side-row[b-7kasneb7xg] {
    border-bottom-color: rgba(120,82,10,0.22);
    border-left-color: transparent;
}

[data-bs-theme=light] .ma-side-row:hover[b-7kasneb7xg],
[data-bs-theme=light] .ma-side-row:focus-visible[b-7kasneb7xg] {
    background: rgba(120,82,10,0.07);
    border-left-color: rgba(120,82,10,0.4);
}

[data-bs-theme=light] .ma-side-row--active[b-7kasneb7xg] {
    background: rgba(120,82,10,0.10);
    border-left-color: var(--theme-light-accent);
    box-shadow: inset 3px 0 8px rgba(120,82,10,0.12);
}

[data-bs-theme=light] .ma-side-active-dot[b-7kasneb7xg] {
    background: var(--theme-light-accent);
    box-shadow: 0 0 6px rgba(120,82,10,0.5);
}

/* ── Text-only mode ── */
.text-only .ma-side-board[b-7kasneb7xg] {
    background: transparent;
    border: 1px solid var(--bs-border-color);
    border-top-width: 1px;
    box-shadow: none;
}

.text-only .ma-side-board-header[b-7kasneb7xg] {
    background: var(--bs-secondary-bg);
    border-bottom-color: var(--bs-border-color);
}

.text-only .ma-side-board-title[b-7kasneb7xg] {
    color: var(--bs-body-color);
    font-family: var(--bs-font-sans-serif);
    font-size: 0.7rem;
    letter-spacing: 0;
}

.text-only .ma-side-row[b-7kasneb7xg] {
    border-left: none;
    border-bottom-color: var(--bs-border-color);
    padding: 6px 10px;
}

.text-only .ma-side-row:hover[b-7kasneb7xg] {
    background: var(--bs-secondary-bg);
}

.text-only .ma-side-row--active[b-7kasneb7xg] {
    background: var(--bs-secondary-bg);
    border-left: 3px solid var(--theme-primary);
    box-shadow: none;
}

/* Hide flap cells and chrome; show plain text from data-dest */
.text-only .ma-side-board .ma-flap[b-7kasneb7xg],
.text-only .ma-side-board .ma-side-active-dot[b-7kasneb7xg],
.text-only .ma-side-board .ma-side-board-lamps[b-7kasneb7xg] {
    display: none;
}

.text-only .ma-side-board .ma-col-flaps[b-7kasneb7xg]::after {
    content: attr(data-dest);
    font-family: var(--bs-font-sans-serif);
    font-size: 0.9rem;
    color: var(--bs-body-color);
    text-transform: capitalize;
    letter-spacing: 0;
}
/* /Components/Pages/VolunteerTeamsPage.razor.rz.scp.css */
.card-body[b-ogq7l23t1s]   p {
    margin-bottom: 0.5rem;
}

.text-only .badge.bg-primary[b-ogq7l23t1s] {
    background-color: rgba(var(--bs-body-color-rgb),1) !important;
    color: rgba(var(--bs-body-bg-rgb),1) !important
}

.columns[b-ogq7l23t1s] {
    column-gap: 20px;
}

@media (min-width: 768px) {
    .columns[b-ogq7l23t1s] {
        column-count: 1;
    }
}

@media (min-width: 992px) {
    .columns[b-ogq7l23t1s] {
        column-count: 2;
    }
}

.member-row[b-ogq7l23t1s] {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.badge[b-ogq7l23t1s] {
    min-width: 65px;
    flex-shrink: 0;
}

.badge-name-indent[b-ogq7l23t1s] {
    flex: 1 1 0;
    min-width: 0;
    /* Indent only wrapped lines */
    text-indent: 0;
    padding-left: 0;
    margin-left: 8px; /* space between badge and name */
}
/* /Components/Shared/CustomDatePicker.razor.rz.scp.css */
.custom-datepicker .input-group[b-8zlrkujl4e] {
    display: flex;
    align-items: center;
}

.custom-datepicker input[b-8zlrkujl4e] {
    cursor: pointer;
}

.custom-datepicker .btn[b-8zlrkujl4e] {
    margin-left: -1px;
}

/* small legend swatches */
.datepicker-legend[b-8zlrkujl4e] {
    gap: 0.75rem;
}

    .datepicker-legend .swatch[b-8zlrkujl4e] {
        width: 14px;
        height: 14px;
        display: inline-block;
        border-radius: 2px;
        border: 1px solid rgba(0,0,0,0.08);
    }

        /* reuse existing day colouring classes if present - stronger / less muted defaults */
        .datepicker-legend .swatch.range1[b-8zlrkujl4e] { /* stronger fallback color */
            background: rgba(13,110,253,0.85);
            border-color: rgba(13,110,253,0.95);
            color: #fff;
        }

        .datepicker-legend .swatch.range2[b-8zlrkujl4e] { /* stronger fallback color */
            background: rgba(25,135,84,0.85);
            border-color: rgba(25,135,84,0.95);
            color: #fff;
        }

.custom-datepicker[b-8zlrkujl4e] {
    position: relative;
    display: block;
}

    .custom-datepicker .dropdown-menu[b-8zlrkujl4e] {
        z-index: 3000;
        border-radius: .4rem;
    }

    .custom-datepicker .calendar-table th[b-8zlrkujl4e] {
        width: 2rem;
    }

    .custom-datepicker .day-cell[b-8zlrkujl4e] {
        width: 2rem;
        height: 2rem;
        line-height: 1.4rem;
        border-radius: .35rem;
    }

        .custom-datepicker .day-cell.muted[b-8zlrkujl4e] {
            opacity: .45;
        }

        .custom-datepicker .day-cell.disabled[b-8zlrkujl4e] {
            pointer-events: none;
            opacity: .5;
        }

        /* selected fallback when day-cell + selected classes are present */
        .custom-datepicker .day-cell.selected[b-8zlrkujl4e] {
            background-color: var(--theme-primary);
            color: #fff;
        }

        /* stronger, less-muted colors for ranges with high contrast text
           Apply to button elements specifically and with higher specificity so
           these rules are not silently overridden by generic button styles. */
        .custom-datepicker .calendar-table button.day-cell.range1[b-8zlrkujl4e],
        .custom-datepicker .calendar-table button.btn.day-cell.range1[b-8zlrkujl4e] {
            background-color: rgba(13,110,253,.60);
            border: 1px solid rgba(13,110,253,.75);
            color: #ffffff;
            box-shadow: inset 0 -2px 0 rgba(0,0,0,0.06);
        }

        .custom-datepicker .calendar-table button.day-cell.range2[b-8zlrkujl4e],
        .custom-datepicker .calendar-table button.btn.day-cell.range2[b-8zlrkujl4e] {
            background-color: rgba(25,135,84,.60);
            border: 1px solid rgba(25,135,84,.75);
            color: #ffffff;
            box-shadow: inset 0 -2px 0 rgba(0,0,0,0.06);
        }

    /* sizing/padding applied to all calendar buttons so selected matches others;
       do NOT set a background here (that previously over-rode .btn-primary) */
    .custom-datepicker .calendar-table button.btn[b-8zlrkujl4e] {
        min-width: 2rem;
        padding: .25rem .35rem;
        border: none;
        color: inherit; /* ensure button text follows context color */
    }

    /* remove background only for truly unstyled day buttons (keep backgrounds for .range1/.range2/.selected/.btn-primary) */
    .custom-datepicker .calendar-table button.btn:not(.range1):not(.range2):not(.selected):not(.btn-primary)[b-8zlrkujl4e] {
        background: none;
    }

    /* ensure Bootstrap primary inside this component keeps its expected colors (higher specificity) */
    .custom-datepicker .calendar-table button.btn.btn-primary[b-8zlrkujl4e] {
        background-color: var(--theme-primary);
        border-color: var(--theme-primary);
        color: #fff;
    }

    /* ensure contrast on hover/focus for interactive cells */
    .custom-datepicker .calendar-table button.btn:hover:not(.disabled)[b-8zlrkujl4e],
    .custom-datepicker .calendar-table button.btn:focus:not(.disabled)[b-8zlrkujl4e] {
        filter: brightness(.95);
        text-decoration: none;
    }

    /* ensure Bootstrap primary appearance is preserved for the selected day button
       using a selector with higher specificity and explicit background-image removal */
    .custom-datepicker .calendar-table button.btn.day-cell.selected[b-8zlrkujl4e],
    .custom-datepicker .calendar-table button.btn.btn-primary.day-cell.selected[b-8zlrkujl4e],
    .custom-datepicker .calendar-table button.day-cell.btn-primary.selected[b-8zlrkujl4e] {
        background-color: var(--theme-primary);
        border-color: var(--theme-primary);
        color: #fff;
        background-image: none; /* override any gradient/background applied by bootstrap */
        box-shadow: none;
        min-width: 2rem; /* match sizing with other cells */
        padding: .25rem .35rem;
    }
/* /Components/Shared/HoldingPage.razor.rz.scp.css */
.holding-page[b-j27nlc9120] {
    min-height: 100vh;
    padding: 2rem 1rem;
    background-color: #0d172a;
    background-image: radial-gradient(circle at top center, rgba(255, 255, 255, 0.08), transparent 26%);
    color: var(--bs-body-color, #fff);
}

.holding-page-card[b-j27nlc9120] {
    position: relative;
    overflow: visible;
    width: min(100%, 860px);
    margin: 0 auto;
    padding: 0;
    border-radius: 2rem;
    background: rgba(10, 18, 32, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 40px 100px rgba(0, 0, 0, 0.35);
    display: grid;
    gap: 0;
}

.holding-page-top[b-j27nlc9120] {
    position: relative;
    padding: 2rem 1.5rem 1.5rem;
    overflow: hidden;
}

.holding-page-sky[b-j27nlc9120] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 0;
    pointer-events: none;
}

.ma-footer-sky[b-j27nlc9120] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.ma-footer-sky[b-j27nlc9120]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 15%;
    background: transparent;
    z-index: 3;
    pointer-events: none;
    mix-blend-mode: screen;
    opacity: 0;
    transition: opacity 1.5s ease, background 1.5s ease;
}

.ma-footer-sky.sky-day[b-j27nlc9120] {
    background-color: #79addc;
}

.ma-sky-clouds[b-j27nlc9120] {
    position: absolute;
    top: 0;
    width: calc(100% + 800px);
    pointer-events: none;
    z-index: 3;
    opacity: 0;
    transition: opacity 2s ease, filter 2s ease;
}

.ma-sky-clouds-hi[b-j27nlc9120] {
    height: 55%;
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 600 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cellipse cx='80' cy='72' rx='70' ry='28' fill='rgba(255,255,255,0.55)'/%3E%3Cellipse cx='70' cy='68' rx='45' ry='22' fill='rgba(255,255,255,0.4)'/%3E%3Cellipse cx='105' cy='65' rx='55' ry='24' fill='rgba(255,255,255,0.5)'/%3E%3Cellipse cx='300' cy='55' rx='90' ry='32' fill='rgba(255,255,255,0.45)'/%3E%3Cellipse cx='285' cy='52' rx='60' ry='25' fill='rgba(255,255,255,0.35)'/%3E%3Cellipse cx='330' cy='50' rx='70' ry='28' fill='rgba(255,255,255,0.4)'/%3E%3Cellipse cx='500' cy='78' rx='75' ry='26' fill='rgba(255,255,255,0.5)'/%3E%3Cellipse cx='488' cy='74' rx='50' ry='20' fill='rgba(255,255,255,0.38)'/%3E%3Cellipse cx='525' cy='72' rx='60' ry='22' fill='rgba(255,255,255,0.44)'/%3E%3C/svg%3E") repeat-x;
    background-size: 600px 100%;
    animation: ma-scroll-sky-hi-b-j27nlc9120 70s linear infinite;
}

.ma-sky-clouds-lo[b-j27nlc9120] {
    height: 48%;
    top: 8%;
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 800 110' xmlns='http://www.w3.org/2000/svg'%3E%3Cellipse cx='110' cy='80' rx='95' ry='30' fill='rgba(255,255,255,0.35)'/%3E%3Cellipse cx='95' cy='76' rx='65' ry='22' fill='rgba(255,255,255,0.28)'/%3E%3Cellipse cx='140' cy='74' rx='75' ry='26' fill='rgba(255,255,255,0.32)'/%3E%3Cellipse cx='370' cy='65' rx='110' ry='35' fill='rgba(255,255,255,0.30)'/%3E%3Cellipse cx='355' cy='60' rx='75' ry='26' fill='rgba(255,255,255,0.25)'/%3E%3Cellipse cx='410' cy='58' rx='85' ry='30' fill='rgba(255,255,255,0.28)'/%3E%3Cellipse cx='650' cy='75' rx='88' ry='28' fill='rgba(255,255,255,0.33)'/%3E%3Cellipse cx='635' cy='70' rx='58' ry='20' fill='rgba(255,255,255,0.26)'/%3E%3Cellipse cx='678' cy='68' rx='68' ry='24' fill='rgba(255,255,255,0.30)'/%3E%3C/svg%3E") repeat-x;
    background-size: 800px 100%;
    animation: ma-scroll-sky-lo-b-j27nlc9120 115s linear infinite;
}

.ma-sky-clouds-hi[b-j27nlc9120] {
    opacity: calc(var(--cloud-cover, 0) / 100 * 0.92);
}

.ma-sky-clouds-lo[b-j27nlc9120] {
    opacity: calc(var(--cloud-cover, 0) / 100 * 0.72);
}

@keyframes ma-scroll-sky-hi-b-j27nlc9120 {
    0% { transform: translateX(0); }
    100% { transform: translateX(-600px); }
}

@keyframes ma-scroll-sky-lo-b-j27nlc9120 {
    0% { transform: translateX(0); }
    100% { transform: translateX(-800px); }
}

.holding-page-brand[b-j27nlc9120] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 1rem;
}

.holding-page-logo[b-j27nlc9120] {
    max-width: 100%;
    height: auto;
    max-height: 12rem;
}

.holding-page-title[b-j27nlc9120] {
    font-size: clamp(2rem, 4vw, 3.6rem);
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.holding-page-description[b-j27nlc9120] {
    max-width: 36rem;
    margin: 0 auto;
    color: rgba(var(--bs-body-color-rgb), 0.8);
}

.holding-page-countdown[b-j27nlc9120] {
    display: grid;
    grid-template-columns: repeat(4, minmax(100px, 1fr));
    gap: 1rem;
    justify-items: center;
    padding: 0 1.5rem 1.5rem;
}

.countdown-unit[b-j27nlc9120] {
    min-width: 100px;
    background: var(--board-bg, #111b2e);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0.85rem;
    padding: 0.85rem 0.7rem;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}

.countdown-unit .ma-col-flaps[b-j27nlc9120] {
    display: inline-flex;
    justify-content: center;
    gap: 0.4rem;
    align-items: center;
    position: relative;
}

.countdown-label[b-j27nlc9120] {
    margin-top: 0.55rem;
    color: var(--board-amber, #ffe082);
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 0.75rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.countdown-unit .ma-flap[b-j27nlc9120] {
    background: var(--board-flap, #111827);
    border-right: 1px solid var(--board-bg, #0c1728);
    color: transparent;
    display: flex;
    flex-direction: column;
    height: 88px;
    width: 48px;
    position: relative;
    flex-shrink: 0;
    perspective: 800px;
}

.countdown-unit .ma-flap[b-j27nlc9120]::before {
    background: var(--board-flap, #111827);
    border-bottom: 1px solid rgba(255,255,255,0.12);
    content: attr(data-char);
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 54px;
    font-weight: 600;
    line-height: 88px;
    height: 44px;
    overflow: hidden;
    text-align: center;
    width: 100%;
    color: var(--board-amber, #ffe082);
    text-shadow: 0 0 8px var(--board-amber-dim, rgba(255, 208, 122, 0.35));
    z-index: 2;
    display: block;
    backface-visibility: hidden;
    transform-style: preserve-3d;
}

.countdown-unit .ma-flap[b-j27nlc9120]::after {
    background: var(--board-flap-line, #0c1728);
    content: attr(data-char);
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    font-size: 54px;
    font-weight: 600;
    line-height: 88px;
    height: 88px;
    margin-top: -44px;
    overflow: hidden;
    text-align: center;
    width: 100%;
    color: var(--board-amber, #ffe082);
    opacity: 0.7;
    text-shadow: 0 0 5px var(--board-amber-dim, rgba(255, 208, 122, 0.35));
    z-index: 1;
    display: block;
    backface-visibility: hidden;
    transform-style: preserve-3d;
}

.countdown-unit .ma-flap[data-char=" "][b-j27nlc9120]::before,
.countdown-unit .ma-flap[data-char=" "][b-j27nlc9120]::after {
    content: '\00a0';
}

.countdown-unit .ma-flap.is-cycling[b-j27nlc9120]::before,
.countdown-unit .ma-flap.is-cycling[b-j27nlc9120]::after {
    color: var(--board-amber, #ffe082);
    text-shadow: 0 0 14px var(--board-amber, #ffe082);
    animation: ma-cycle-b-j27nlc9120 180ms linear 1;
    animation-fill-mode: forwards;
}

@keyframes ma-cycle-b-j27nlc9120 {
    0%   { transform: rotateX(0deg); }
    50%  { transform: rotateX(180deg); }
    100% { transform: rotateX(360deg); }
}

.holding-page-meta[b-j27nlc9120] {
    color: rgba(var(--bs-body-color-rgb), 0.75);
}

.holding-page-blimp[b-j27nlc9120] {
    position: absolute;
    top: 1rem;
    right: -1rem;
    width: 220px;
    height: 100px;
    animation: holding-page-blimp-float-b-j27nlc9120 8s ease-in-out infinite;
    overflow: visible;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.22));
}

.holding-page-blimp .ma-dirigible[b-j27nlc9120] {
    position: absolute;
    left: auto;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.holding-page-blimp .ma-dirigible.is-docked[b-j27nlc9120] {
    animation: none;
}

.holding-page-blimp .ma-dirigible-bob[b-j27nlc9120] {
    position: relative;
    width: 100%;
    height: 100%;
    animation: ma-dirigible-bob-b-j27nlc9120 4s ease-in-out infinite alternate;
}

.holding-page-blimp .ma-dirigible-bob svg[b-j27nlc9120] {
    width: 100%;
    height: 100%;
    display: block;
}

.holding-page-blimp .propeller-spin[b-j27nlc9120] {
    transform-origin: 40px 92px;
    animation: ma-spin-b-j27nlc9120 0.3s linear infinite;
}

@keyframes holding-page-blimp-float-b-j27nlc9120 {
    0%, 100% {
        transform: translateX(0) translateY(0) rotate(-2deg);
    }
    50% {
        transform: translateX(-18px) translateY(-18px) rotate(3deg);
    }
}

@keyframes ma-dirigible-bob-b-j27nlc9120 {
    0%   { transform: translateY(0px) rotate(0deg); }
    30%  { transform: translateY(-5px) rotate(0.4deg); }
    60%  { transform: translateY(-3px) rotate(-0.3deg); }
    100% { transform: translateY(-8px) rotate(0.6deg); }
}

@keyframes ma-spin-b-j27nlc9120 {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@media (max-width: 768px) {
    .holding-page-card[b-j27nlc9120] {
        padding: 2rem 1.5rem;
    }

    .holding-page-countdown[b-j27nlc9120] {
        grid-template-columns: repeat(2, minmax(90px, 1fr));
    }

    .holding-page-blimp[b-j27nlc9120] {
        width: 210px;
        right: -3rem;
        top: 0.5rem;
    }
}
/* /Components/Shared/ImageCarousel.razor.rz.scp.css */
.ic-viewport[b-uq2zpgg2ho] {
  position: relative;
  width: 100%;
  overflow: hidden;
  z-index: 0;
  container-type: inline-size;
}

/* Single rail; oscillates between 0 and −maxShift */
.ic-rail[b-uq2zpgg2ho] {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0;
  padding: var(--pad, 0px);
  width: max-content;
  will-change: transform;
  animation: ic-osc-b-uq2zpgg2ho var(--duration, 20s) linear infinite;
  animation-direction: alternate;
  position: relative;
  z-index: 0;

  /* Center the rail only when it’s narrower than the viewport; when it overflows, auto margins have no effect */
  margin-left: auto;
  margin-right: auto;

  /* total content length of a single pass (items + gaps) */
  --total: calc(var(--count, 0) * var(--item-width, 280px) + (max(0, var(--count, 0) - 1)) * var(--gap, 6px));
  /* max shift is total - containerWidth (100cqw); if negative, result is 0 (no movement) */
  --maxShift: max(0px, calc(var(--total) - 100cqw));
}

.ic-rail.ic-reverse[b-uq2zpgg2ho] { animation-direction: alternate-reverse; }
.ic-rail.ic-noanim[b-uq2zpgg2ho]  { animation: none; }

/* Pause on hover if enabled */
.ic-pause-on-hover:hover .ic-rail[b-uq2zpgg2ho] { animation-play-state: paused; }

/* Fixed item width; as many as fit will be visible */
.ic-item[b-uq2zpgg2ho] {
  flex: 0 0 var(--item-width, 280px);
  margin-right: var(--gap, 6px);
  box-sizing: border-box;
}

.ic-item:last-child[b-uq2zpgg2ho] { margin-right: 0; }

.ic-item .img-thumbnail[b-uq2zpgg2ho],
.ic-item img[b-uq2zpgg2ho],
.ic-item picture[b-uq2zpgg2ho],
.ic-item figure[b-uq2zpgg2ho] {
  width: 100%;
  margin: 0 !important;
  display: block;
  box-sizing: border-box;
}

/* Oscillate between 0 and the exact max shift computed above */
@keyframes ic-osc-b-uq2zpgg2ho {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(calc(-1 * var(--maxShift)), 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .ic-rail[b-uq2zpgg2ho] { animation: none; }
}
/* /Components/Shared/MosaicGallery.razor.rz.scp.css */
.mosaic-gallery[b-z1immqv6hz] {
    --gap: 2rem;
    --columns: 3;
    display: grid;
    grid-template-columns: repeat(var(--columns), 1fr);
    gap: var(--gap);
    width: 100%;
}

.mosaic-gallery.masonry[b-z1immqv6hz] {
    --gap: 2rem;
    --columns: 3;
    --row-height: 10px; /* slightly larger base row height for coarser spans */
    display: grid;
    grid-template-columns: repeat(var(--columns), 1fr);
    grid-auto-rows: var(--row-height);
    gap: var(--gap);
    width: 100%;
}

/* items */
.mosaic-item[b-z1immqv6hz] {
    display: inline-block;
    width: 100%;
    margin: 0 0 var(--gap);
    position: relative;
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    outline: none;
    cursor: pointer;
    border-radius: .5rem;
    overflow: hidden;
    background: var(--bs-body-bg);
    box-shadow: 0 6px 20px rgba(0,0,0,0.06);
    transition: transform .25s ease, box-shadow .25s ease;
}

.mosaic-item img[b-z1immqv6hz] {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: .5rem;
    transition: transform .35s ease;
    will-change: transform;
}

/* subtle hover zoom */
.mosaic-item:focus img[b-z1immqv6hz],
.mosaic-item:hover img[b-z1immqv6hz] {
    transform: scale(1.03);
    box-shadow: 0 10px 30px rgba(0,0,0,0.12);
}

/* overlay for title/tags in mosaic view */
/* improved contrast: full-width gradient + backing layer + stronger text styles */
.mosaic-overlay[b-z1immqv6hz] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    box-sizing: border-box;
    padding: 1rem 1.1rem;                /* breathing room */
    color: #fff;
    pointer-events: none;
    display: flex;
    flex-direction: column;
    gap: .35rem;
    align-items: flex-start;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .28s ease, transform .28s ease;
    z-index: 2; /* ensure it sits above pseudo background */

    /* fallback background for old browsers */
    background: linear-gradient(180deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.45) 45%, rgba(0,0,0,0.75) 100%);
}

/* backing pseudo-element � provides a stronger, consistent backdrop without obscuring the image */
.mosaic-overlay[b-z1immqv6hz]::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: .45rem;
    /* layered gradient + subtle dark tint to guarantee contrast on bright images */
    background: linear-gradient(180deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.55) 45%, rgba(0,0,0,0.85) 100%);
    /* gentle blur to reduce busy backgrounds */
    backdrop-filter: blur(4px) saturate(1.05);
    -webkit-backdrop-filter: blur(4px) saturate(1.05);
    pointer-events: none;
}

/* show overlay on hover/focus of the item */
.mosaic-item:hover .mosaic-overlay[b-z1immqv6hz],
.mosaic-item:focus .mosaic-overlay[b-z1immqv6hz],
.mosaic-item:focus-within .mosaic-overlay[b-z1immqv6hz] {
    opacity: 1;
    transform: translateY(0);
}

/* Make title and tags more prominent */
.mosaic-title[b-z1immqv6hz] {
    position: relative;
    z-index: 3;
    font-weight: 700;
    font-size: 1.05rem; /* slightly larger */
    line-height: 1.1;
    margin: 0;
    color: #fff;
    /* stronger shadow for readability across varied images */
    text-shadow: 0 3px 8px rgba(0,0,0,0.75);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mosaic-tags[b-z1immqv6hz] {
    position: relative;
    z-index: 3;
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
    font-size: .85rem; /* slightly bigger for readability */
    opacity: 1;
}

.mosaic-tags .tag[b-z1immqv6hz] {
    font-size: .78rem;
    background: rgba(0,0,0,0.45); /* darker tag background for contrast */
    padding: .18rem .5rem;
    border-radius: .35rem;
    color: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,0.45);
}

/* Zoom backdrop & panel */
.mosaic-zoom-backdrop[b-z1immqv6hz] {
    position: fixed;
    inset: 0;
    z-index: 2500;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.75);
    padding: 2rem;
    backdrop-filter: blur(3px);
    outline: none;
}

.mosaic-zoom[b-z1immqv6hz] {
    position: relative;
    max-width: 95%;
    max-height: 95%;
    display:flex;
    align-items:center;
    gap: .5rem;
}

.mz-content[b-z1immqv6hz] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: auto;
    padding: .25rem;
}

.mz-content img[b-z1immqv6hz] {
    max-width: 80vw;
    max-height: 80vh;
    width: auto;
    height: auto;
    display:block;
    border-radius: .35rem;
    box-shadow: 0 6px 20px rgba(0,0,0,0.6);
}

/* controls */
.mz-close[b-z1immqv6hz] {
    position: absolute;
    top: -.6rem;
    right: -.6rem;
    z-index: 5;
}
.mz-nav[b-z1immqv6hz] {
    background: rgba(255,255,255,0.06);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.12);
    height: 2.6rem;
    width: 2.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: 1.25rem;
    border-radius: .35rem;
}

/* responsive adjustments */
@media (max-width: 1199px) {
    .mosaic-gallery[b-z1immqv6hz] { column-count: min(3, var(--columns)); }
    .mosaic-gallery.masonry[b-z1immqv6hz] { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
    .mosaic-gallery[b-z1immqv6hz] { --columns: 2; }
    .mosaic-gallery.masonry[b-z1immqv6hz] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .mosaic-gallery[b-z1immqv6hz] { --columns: 1; }
    .mz-nav[b-z1immqv6hz] { height: 2.2rem; width: 2.2rem; font-size: 1rem; }
    .mosaic-gallery.masonry[b-z1immqv6hz] { grid-template-columns: repeat(1, 1fr); }
}
/* /Components/Shared/ProgrammeScheduler.razor.rz.scp.css */
.programme-scheduler[b-8huykzaegp] {
    width: 100%;
    /* maximum visible timeline height (can be overridden via component parameter or CSS custom property) */
    --timeline-max-height: 72vh;
    /* single source of truth for the left-column width so layout and scrollbar align */
    --left-column-width: 180px;
    --event-gap: 4px;
    --hour-width: 120px;
    --event-max-lines: 2;
    --event-icons-reserve: 1.6rem; /* space reserved for ticket/18+ icons (vertical stack) */
    /* width reserved for the right-side stacked icon column (fav + volunteer + icon row) */
    --volunteer-icon-width: 28px; /* width reserved only for the volunteer/favourite column */
    --right-icon-offset: 6px; /* horizontal offset from the event right edge for right-column icons */
    /* pixels-per-minute (used for absolute positioning instead of %) */
    --px-per-minute: calc(var(--hour-width) / 60);
    /* indent at start and end of events so grid lines show through */
    --event-indent: 3px;
}

.ped-chip[b-8huykzaegp] {
    display: inline-flex;
    align-items: center;
    font-size: 0.9rem;
    line-height: 1.2;
    background-color: var(--bs-tertiary-bg);
    color: var(--bs-emphasis-color);
    gap: 0.35rem;
    padding: 0.2rem 0.5rem;
    border-radius: 999px;
    border: 1px solid var(--bs-border-color);
}

.scheduler-scrollbar-top[b-8huykzaegp] {
    height: 12px;
    scrollbar-width: thin;
    /* indent the top scrollbar so it aligns with the timeline (doesn't overlap room headers) */
    margin-left: var(--left-column-width);
    width: calc(100% - var(--left-column-width));
    box-sizing: border-box;
    z-index: 40;
}

    .scheduler-scrollbar-top div[b-8huykzaegp] {
        /* default width matches the timeline content; JS will adjust on render */
        width: calc(var(--hour-width) * var(--hours, 1));
        scrollbar-width: thin;
    }

/* Narrow scrollbars for the Programme Scheduler (scoped) */
.programme-scheduler .timeline-inner[b-8huykzaegp],
.programme-scheduler .timeline-left[b-8huykzaegp],
.programme-scheduler .scheduler-scrollbar-top[b-8huykzaegp],
.programme-scheduler[b-8huykzaegp] {
    /* Firefox */
    scrollbar-width: thin;
    /* fallback for legacy browsers */
    -ms-overflow-style: -ms-autohiding-scrollbar;
}

/* WebKit/Chromium scrollbar styling (scoped to the component) */
.programme-scheduler *[b-8huykzaegp]::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.programme-scheduler *[b-8huykzaegp]::-webkit-scrollbar-thumb {
    background-color: rgba(255,255,255,0.08);
    border-radius: 8px;
    border: 2px solid rgba(0,0,0,0.14);
}
.programme-scheduler *[b-8huykzaegp]::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255,255,255,0.12);
}
.programme-scheduler *[b-8huykzaegp]::-webkit-scrollbar-track {
    background: transparent;
}

.timeline-container[b-8huykzaegp] {
    scrollbar-width: thin;
    position: relative;
    /* default explicit height so the scheduler is vertically constrained (Razor inline height will override when provided) */
    height: 480px;
    /* Respect the CSS variable so the cap can be overridden or made responsive */
    max-height: var(--timeline-max-height, 72vh);
    overscroll-behavior: contain; /* prevent page scroll chaining */
    touch-action: auto; /* allow native touch gestures by default; JS handles mouse/pen drag */
    /* outer container does NOT scroll horizontally — inner scroller (.timeline-inner) handles both axes */
    overflow: hidden;
    -webkit-overflow-scrolling: touch; /* smooth iOS scroll */
    --fade-width: 48px;
    cursor: grab; /* drag-to-scroll affordance */
    /* Fade only the right edge of the visible viewport */
    -webkit-mask-image: linear-gradient( to right, #000 0, #000 calc(100% - var(--fade-width)), rgba(0,0,0,0) 100% );
    mask-image: linear-gradient( to right, #000 0, #000 calc(100% - var(--fade-width)), rgba(0,0,0,0) 100% );
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

    /* While dragging: prevent text selection and show grabbing cursor */
    .timeline-container.is-dragging[b-8huykzaegp] {
        cursor: grabbing;
    }

/* Ensure the content itself is not masked (fixes blank area when scrolling) */
.timeline-grid[b-8huykzaegp] {
    -webkit-mask-image: none !important;
    mask-image: none !important;
}

.timeline-grid[b-8huykzaegp] {
    display: grid;
    /* Make the first column shrink on small screens */
    grid-template-columns: var(--left-column-width) 1fr;
    grid-template-rows: 44px;
    grid-auto-rows: minmax(80px, auto);
    row-gap: 0.2rem;
    align-items: stretch;
}

/* New layout helpers: make the left column fixed and the right side the scrollable pane */
.timeline-viewport[b-8huykzaegp] {
    display: flex;
    height: 100%;
    min-height: 0; /* allow children with overflow to shrink and scroll */
    align-items: stretch;
}

.timeline-left[b-8huykzaegp] {
    flex: 0 0 var(--left-column-width);
    box-sizing: border-box;
    overflow-y: auto;
    height: 100%;
    -webkit-overflow-scrolling: touch;
}

.timeline-right[b-8huykzaegp] {
    flex: 1 1 auto;
    min-width: 0; /* critical so child can overflow horizontally */
    overflow: hidden;
    height: 100%;
}

.timeline-inner[b-8huykzaegp] {
    width: 100%;
    height: 100%;
    overflow: auto; /* this is the primary scroll container (both axes) */
    position: relative;
    min-width: 0;
    -webkit-overflow-scrolling: touch;
}

.timeline-scroll[b-8huykzaegp] {
    width: calc(var(--hour-width) * var(--hours, 1));
    min-width: calc(var(--hour-width) * var(--hours, 1));
    box-sizing: border-box;
}


.header-cell[b-8huykzaegp] {
    font-weight: 600;
    color: var(--bs-emphasis-color);
}

/* Keep absolute positioning for time header legend button (if used there) */
.scheduler-key-btn[b-8huykzaegp] {
    position: absolute;
    top: .25rem;
    right: .25rem;
    z-index: 2;
    padding: .15rem .35rem;
}

/* But when the button is inside the left room header cell, keep it inline-left */
.room-header.header-cell .scheduler-key-btn[b-8huykzaegp] {
    position: static;
}

/* Time header container */
.time-header[b-8huykzaegp] {
    border: 1px solid var(--bs-border-color);
    border-top-right-radius: var(--bs-border-radius);
    border-bottom-right-radius: var(--bs-border-radius);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    position: sticky; /* keep header visible while the main pane scrolls vertically */
    top: 0;
    z-index: 30;
    background: var(--bs-body-bg);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    /* explicit height so the time-header aligns with the left header-cell */
    height: 44px;
}

.time-header .time-content[b-8huykzaegp] {
    height: 100%;
}

    /* Width driver for the entire scrollable timeline column */
    .time-header .time-content[b-8huykzaegp] {
        width: calc(var(--hour-width) * var(--hours, 1));
    }

.time-scale[b-8huykzaegp] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: var(--hour-width);
    column-gap: 0;
    align-items: center;
    text-align: center;
    color: var(--bs-secondary-color);
    font-size: .9rem;
    height: 100%;
}

/* Remove borders in header ticks */
.time-header .time-cell[b-8huykzaegp] {
    border-left: 0;
}

/* Room header: sticky left column box with left-only rounded corners */
.room-header[b-8huykzaegp] {
    position: sticky;
    left: 0;
    z-index: 10;
    padding: .5rem;
        /* match the track row height so left headers line up with tracks */
        height: 80px;
        align-self: start;
        background-color: var(--bs-body-bg) !important;
        border: 1px solid var(--bs-border-color);
        border-top-left-radius: var(--bs-border-radius);
        border-bottom-left-radius: var(--bs-border-radius);
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .room-header.header-cell[b-8huykzaegp] {
        /* keep the top-left header pinned while the room list scrolls */
        position: sticky;
        top: 0;
        z-index: 35; /* above regular room rows but below the top scrollbar */
        /* top-left header row is shorter */
        height: 44px;
        align-self: start;
        background-color: var(--bs-body-bg) !important; /* ensure opaque background when pinned */
    }

    /* Vertically center text inside the room header box */
    .room-header .template-wrap[b-8huykzaegp] {
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center; /* vertical centering */
        align-items: flex-start; /* keep horizontal left alignment */
    }

    .room-header .fw-light[b-8huykzaegp] {
        color: var(--bs-secondary-color);
        max-width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

/* Prevent room header text from expanding the row height */
.programme-scheduler .room-header[b-8huykzaegp] {
    overflow: hidden;
}

    /* Allow inner text to shrink and ellipsize inside grid/flex containers */
    .programme-scheduler .room-header .template-wrap[b-8huykzaegp] {
        display: flex;
        flex-direction: column;
        gap: 0.125rem;
        min-width: 0; /* critical for text-overflow inside grid/flex */
    }

        /* Truncate both the room name and hotel name to a single line each */
        .programme-scheduler .room-header .template-wrap .lead[b-8huykzaegp],
        .programme-scheduler .room-header .template-wrap .fw-light[b-8huykzaegp] {
            display: block;
            font-size: 1rem !important;
            max-width: 100%;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

         .programme-scheduler .room-header .template-wrap .fw-light[b-8huykzaegp] {
            font-size: 0.8rem !important;
        }

/* Time cells */
.time-cell[b-8huykzaegp] {
    position: relative;
    border-left: 1px solid var(--bs-border-color);
    padding-left: 5px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: start;
}

/* Tracks (rows) */
.room-track[b-8huykzaegp] {
    position: relative;
    height: 80px;
    overflow: visible;
    border-top-right-radius: var(--bs-border-radius);
    border-bottom-right-radius: var(--bs-border-radius);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border: 1px solid var(--bs-border-color);
    background-color: var(--bs-body-bg);
}

/* Hour columns inside each track (alternating columns only) */
.track-bg[b-8huykzaegp] {
    position: absolute;
    inset: 0;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: var(--hour-width);
    width: calc(var(--hour-width) * var(--hours, 1)); /* absolute width for the hour grid */
}

.track-cell[b-8huykzaegp] {
    position: relative;
    border-left: 1px dashed var(--bs-border-color-translucent);
}

    .track-cell:first-child[b-8huykzaegp] {
        border-left: 0;
    }

    .track-cell:nth-child(even)[b-8huykzaegp] {
        background-color: var(--bs-tertiary-bg);
    }

    .track-cell[b-8huykzaegp]::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 50%;
        border-left: 1px dotted var(--bs-border-color-translucent);
        opacity: .6;
        pointer-events: none;
    }

/* Events */
.event[b-8huykzaegp] {
    position: absolute;
    top: .25rem;
    bottom: .25rem;
    /* Absolute pixel positioning via minutes -> px,
       with 3px indent at both start and end so lines show through */
    left: calc(var(--start-min, 0) * var(--px-per-minute) + var(--event-indent, 3px));
    width: max(0px, calc(var(--dur-min, 0) * var(--px-per-minute) - (var(--event-indent, 3px) * 2)));
    border-radius: var(--bs-border-radius);
    padding: .25rem .5rem;
    display: flex;
    align-items: center;
    overflow: visible;
    box-shadow: var(--bs-box-shadow-sm);
    cursor: pointer;
}

    .event .event-time[b-8huykzaegp] {
        position: absolute;
        top: 4px;
        right: 4px;
        font-size: 0.7rem;
        opacity: 0.8;
        background-color: rgba(0, 0, 0, 0.1);
        padding: 1px 4px;
        border-radius: 3px;
    }


/* Diagonal stripe overlay for hidden events (scheduler tiles) */
.room-track .event.is-hidden[b-8huykzaegp] {
    position: absolute; /* already absolute, keep for clarity */
}

    .room-track .event.is-hidden[b-8huykzaegp]::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        border-radius: inherit;
        background: repeating-linear-gradient( 45deg, rgba(0, 0, 0, 0.18) 0px, rgba(0, 0, 0, 0.18) 8px, rgba(0, 0, 0, 0.0) 8px, rgba(0, 0, 0, 0.0) 16px );
    }

/* Multi-line clamped title with ellipses */
.event .subject[b-8huykzaegp] {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 1rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--event-max-lines, 2);
    line-clamp: var(--event-max-lines, 2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    overflow-wrap: anywhere;
    position: relative; /* containing block for the subject-text */
}

/* Inner single-line text used for the marquee effect */
.event .subject-text[b-8huykzaegp] {
    display: inline-block;
    white-space: nowrap;
    will-change: transform;
    transition: transform 200ms linear;
    padding-right: 0.25rem; /* small gap for readability */
}

/* Only start the animation when the .event receives the is-marquee class */
.event.is-marquee .subject-text[b-8huykzaegp] {
    animation-name: ps-marquee-b-8huykzaegp;
    animation-duration: var(--marquee-duration, 6s);
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

/* While the timeline is being actively scrolled, pause/disable CSS marquee so JS-driven sync can operate */
.timeline-inner.is-scrolling .event .subject-text[b-8huykzaegp],
.event.is-scrolling .subject-text[b-8huykzaegp] {
    animation: none !important;
    transition: transform 120ms linear;
}

@keyframes ps-marquee-b-8huykzaegp {
    from { transform: translateX(0); }
    to   { transform: translateX(calc(var(--marquee-translate, 0) * -1)); }
}

/* Agenda view */
.agenda-view[b-8huykzaegp] {
    display: grid;
    gap: .75rem;
}

.agenda-item[b-8huykzaegp] {
    border-radius: var(--bs-border-radius);
    padding: .5rem .75rem;
    box-shadow: var(--bs-box-shadow-sm);
    cursor: pointer;
}

/* Bottom-right icons overlay (vertical stack) */
.event .event-icons[b-8huykzaegp] {
    position: absolute;
    right: var(--right-icon-offset);
    top: 48px; /* place icons below favorite (top) and volunteer controls (top:24px) */
    display: inline-flex;
    flex-direction: row; /* keep other icons horizontal */
    align-items: center;
    gap: .35rem;
    font-size: .95rem;
    color: currentColor;
    pointer-events: auto; /* allow buttons inside to be clickable */
    opacity: .95;
}

/* individual icon elements are decorative so they don't intercept pointer events */
.event .event-icons i[b-8huykzaegp] {
    pointer-events: none;
    display: inline-block;
    line-height: 1;
}

/* ensure subject reserves space for the right-column icon stack */
.event.has-icons .subject[b-8huykzaegp] {
    /* Reserve space only for the bottom icon row (no volunteer column here). */
    padding-right: calc(var(--event-icons-reserve) + var(--right-icon-offset) + 0.25rem);
}

/* If an event exposes the volunteer control, reserve space for that column */
.event.has-volunteer .subject[b-8huykzaegp] {
    padding-right: calc(var(--volunteer-icon-width));
}

/* Both bottom icons and volunteer present — reserve everything. */
.event.has-icons.has-volunteer .subject[b-8huykzaegp] {
    padding-right: calc(var(--event-icons-reserve)) ;
}

/* Inner clipping container: prevents subject-text from sliding under the right-side icons */
.event .subject-inner[b-8huykzaegp] {
    display: inline-block;
    /* don't subtract the volunteer column here — reserve is handled by .event .subject */
    width: 100%;
    max-width: 100%;
    vertical-align: top;
    overflow: hidden;
    box-sizing: border-box;
    padding-right: 0; /* rely on the outer .subject padding for icon reserve */
}

/* Ensure the subject-text sits inside the clipped container */
.event .subject-text[b-8huykzaegp] {
    display: inline-block;
    white-space: nowrap;
    will-change: transform;
    transition: transform 200ms linear;
}

/* Baseline right gap for readability; volunteer/icon reserves are applied conditionally. */
.event .subject[b-8huykzaegp] {
    padding-right: 0.25rem;
}


/* favourite button at the top-right */
.event .fav-top[b-8huykzaegp] {
    position: absolute; /* already positioned inline in markup as well */
    top: 4px;
    right: var(--right-icon-offset);
    background: transparent;
    border: none;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}

/* volunteer controls remain below the favourite button (markup already positions them at top:24px) */
.volunteer-controls[b-8huykzaegp] {
    right: var(--right-icon-offset); /* keep aligned to the same right edge */
}


.event .event-icons .badge-18[b-8huykzaegp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .65rem;
    line-height: 1;
    padding: .1rem .25rem;
    border-radius: 999px;
    border: 1px solid currentColor;
    color: currentColor;
    background: color-mix(in srgb, currentColor 12%, transparent);
}

/* Agenda description styles */
.agenda-desc[b-8huykzaegp] {
    margin-top: .25rem;
    line-height: 1.35;
    white-space: normal; /* allow wrapping */
    overflow-wrap: anywhere; /* avoid overflow on long words/URLs */
}

    .agenda-desc p[b-8huykzaegp] {
        margin: 0 0 .5rem 0;
    }

    .agenda-desc ul[b-8huykzaegp],
    .agenda-desc ol[b-8huykzaegp] {
        margin: 0 0 .5rem 1.25rem;
        padding-left: 1.25rem;
    }

    .agenda-desc a[b-8huykzaegp] {
        color: inherit;
        text-decoration: underline;
    }

/* Mobile tweaks */
@media (max-width: 576px) {
    .timeline-container[b-8huykzaegp] {
        --fade-width: 16px; /* smaller fade on mobile */
    }

    .programme-scheduler[b-8huykzaegp] {
        --hour-width: 96px; /* tighter hour columns, less horizontal scroll needed */
        --event-max-lines: 3; /* allow more wrapping in small space */
        /* reduce the visible cap on small screens */
        --timeline-max-height: 50vh;
    }

    .timeline-grid[b-8huykzaegp] {
        grid-template-columns: minmax(120px, 140px) 1fr; /* narrower sticky first column */
        grid-template-rows: 40px;
    }

    .room-header[b-8huykzaegp] {
        padding: .4rem;
    }

    .time-scale[b-8huykzaegp] {
        font-size: .8rem;
    }
    /* Ensure the info button stays left within the first column on mobile */
    .room-header.header-cell .scheduler-key-btn[b-8huykzaegp] {
        position: static;
    }
}

/* Additional responsive caps based on viewport height */
@media (max-height: 760px) {
    .programme-scheduler[b-8huykzaegp] { --timeline-max-height: 60vh; }
}
@media (min-height: 1200px) {
    .programme-scheduler[b-8huykzaegp] { --timeline-max-height: 80vh; }
}

/* Overlay member picker inside the time header (>= sm) */
.member-picker-overlay[b-8huykzaegp] {
    position: absolute;
    top: .25rem;
    right: .25rem;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .25rem .5rem;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    box-shadow: var(--bs-box-shadow-sm);
}

/* Inline picker shown only on extra small screens */
.member-picker-inline select.form-select[b-8huykzaegp] {
    width: 100%;
}

/* Room header clickable styles */
.room-header:not(.header-cell)[b-8huykzaegp] {
    cursor: pointer;
    transition: background-color 0.15s ease;
}

    .room-header:not(.header-cell):hover[b-8huykzaegp] {
        background-color: var(--bs-tertiary-bg) !important;
    }
/* ---- added: cell & line shimmer styles for the loading placeholder --------------------------------- */
/* Reusable shimmer base */
.programme-scheduler--blank .cell-shimmer[b-8huykzaegp],
.programme-scheduler--blank .shimmer-line[b-8huykzaegp] {
    --shimmer-base: var(--bs-tertiary-bg, #e9edf2);
    position: relative;
    background: linear-gradient(
        90deg,
        rgba(255,255,255,0.04) 0%,
        rgba(255,255,255,0.14) 50%,
        rgba(255,255,255,0.04) 100%
    ), var(--shimmer-base);
    background-size: 200% 100%;
    background-repeat: no-repeat;
    border-radius: 0.25rem;
    overflow: hidden;
    animation: programme-cell-shimmer-b-8huykzaegp 1.25s linear infinite;
}

/* Title/sub lines in the left column */
.programme-scheduler--blank .shimmer-line[b-8huykzaegp] {
    display: block;
    height: 10px;
    margin: 6px 0;
    width: 100%;
    opacity: 0.95;
}
.programme-scheduler--blank .shimmer-line.shimmer-line-title[b-8huykzaegp] { height: 14px; width: 70%; }
.programme-scheduler--blank .shimmer-line.shimmer-line-sub[b-8huykzaegp]   { height: 10px; width: 45%; opacity: 0.9; }

/* Per-cell shimmer inside each hour cell of the blank view */
.programme-scheduler--blank .track-cell[b-8huykzaegp] {
    padding: 8px;
}
.programme-scheduler--blank .track-cell .cell-shimmer[b-8huykzaegp] {
    height: calc(100% - 8px);
    width: calc(100% - 8px);
    margin: 4px;
    border-radius: 6px;
    box-shadow: none;
}

/* Header time cells shimmer */
.programme-scheduler--blank .time-cell[b-8huykzaegp] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
}
.programme-scheduler--blank .time-cell .cell-shimmer[b-8huykzaegp] {
    height: 14px;
    width: 60px;
    border-radius: 6px;
}

/* Slightly darker variant for room-header placeholder area so it visually matches the real header */
.programme-scheduler--blank .room-header[b-8huykzaegp] {
    background: linear-gradient(180deg, var(--bs-body-bg), var(--bs-body-bg));
}

/* Keyframes for the cell shimmer (horizontal sweep) */
@keyframes programme-cell-shimmer-b-8huykzaegp {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Small screens: reduce shimmer sizes so it stays visually consistent */
@media (max-width: 576px) {
    .programme-scheduler--blank .shimmer-line.shimmer-line-title[b-8huykzaegp] { width: 60%; }
    .programme-scheduler--blank .time-cell .cell-shimmer[b-8huykzaegp] { width: 44px; height: 12px; }
    .programme-scheduler--blank .track-cell[b-8huykzaegp] { padding: 6px; }
    .programme-scheduler--blank .track-cell .cell-shimmer[b-8huykzaegp] { margin: 3px; border-radius: 5px; }
}

.btn.btn-sm.btn-link[b-8huykzaegp] {
    width: 24px;
    height: 24px;
    padding: 5px;
}

.volunteer-controls[b-8huykzaegp] {
    display: flex;
    gap: .25rem;
    align-items: center;
    z-index: 65; /* ensure volunteer controls sit above the subject text */
}

.event .event-icons[b-8huykzaegp] {
    z-index: 60; /* keep icon row above subject */
}

.event .fav-top[b-8huykzaegp] { z-index: 70; }

.volunteer-menu-wrapper[b-8huykzaegp] {
    position: relative;
}

.volunteer-menu[b-8huykzaegp] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    min-width: 160px;
    padding: .25rem 0;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    box-shadow: var(--bs-box-shadow);
    z-index: 60;
}

.volunteer-menu .dropdown-item[b-8huykzaegp] {
    width: 100%;
    padding: .25rem .75rem;
    text-align: left;
    background: transparent;
    border: none;
}

.volunteer-menu .dropdown-item:hover[b-8huykzaegp] {
    background: var(--bs-tertiary-bg);
}

.text-only .btn.btn-sm[b-8huykzaegp] {
    color: var(--bs-emphasis-color);
    border-color: var(--bs-emphasis-color);
    background-color: transparent;
}

.text-only .event[b-8huykzaegp],
.text-only .agenda-item[b-8huykzaegp] {
    background-color: var(--bs-body-bg) !important;
    color: var(--bs-body-color) !important;
    box-shadow: none;
    border: 1px solid var(--bs-border-color);
}

    .text-only .agenda-item .subject[b-8huykzaegp] {
        color: var(--bs-body-color) !important;
    }

    .text-only .event .btn[b-8huykzaegp],
    .text-only .agenda-item .btn[b-8huykzaegp] {
        background-color: transparent !important;
        color: var(--bs-body-color) !important;
        border: 1px solid var(--bs-border-color);
    }
/* /Components/Shared/SimpleMultiSelect.razor.rz.scp.css */
/* Chevron now provided by .form-control.with-chevron (see app.css).
   Keep file for component-scoped overrides if needed. */

.simple-multiselect .chevron-icon[b-j3he60wvoj] {
    display: inline-block;
    width: 16px;
    height: 12px;
    color: var(--bs-form-control-color, var(--bs-body-color)); /* theme-aware */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='12' viewBox='0 0 16 12'%3e%3cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M2 3.5L8 9.5L14 3.5'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 16px 12px;
    cursor: pointer;
    user-select: none;
}

/* Disable chevron when the input is disabled */
.simple-multiselect .form-control:disabled ~ .chevron-icon[b-j3he60wvoj] {
    color: var(--bs-secondary-color);
    opacity: .65;
    cursor: default;
    pointer-events: none;
}

/* Ensure dropdown menu has a background and border in all themes */
.simple-multiselect .dropdown-menu[b-j3he60wvoj] {
    background-color: var(--bs-dropdown-bg, var(--bs-body-bg));
    color: var(--bs-dropdown-color, var(--bs-body-color));
    border: var(--bs-dropdown-border-width, var(--bs-border-width)) var(--bs-border-style, solid) var(--bs-dropdown-border-color, var(--bs-border-color));
    border-radius: var(--bs-dropdown-border-radius, .375rem);
    box-shadow: var(--bs-dropdown-box-shadow, 0 .5rem 1rem rgba(0,0,0,.15));
}
/* /Components/Shared/Toast.razor.rz.scp.css */
/* ══════════════════════════════════════════════
   MOIST AIR — Boarding Pass Toast
   ══════════════════════════════════════════════ */

.bp-pass[b-v1f0ydftg7] {
    font-family: 'Share Tech Mono', 'Courier New', monospace;
    background: var(--theme-light-menu-bg);
    color: var(--theme-light-accent);
    border: 1px solid var(--board-frame);
    border-radius: 4px 4px 2px 2px;
    box-shadow: 0 4px 18px rgba(0,0,0,0.45), inset 0 0 40px rgba(120,82,10,0.06);
    min-width: 280px;
    max-width: 340px;
    overflow: hidden;
    position: relative;
}

/* Header strip */
.bp-header[b-v1f0ydftg7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--board-bg);
    padding: 5px 12px 4px;
    border-bottom: 1px solid var(--board-frame);
}

.bp-airline[b-v1f0ydftg7] {
    font-size: 0.7rem;
    letter-spacing: 0.25em;
    color: var(--board-amber);
    text-transform: uppercase;
}

.bp-status-chip[b-v1f0ydftg7] {
    font-size: 0.58rem;
    letter-spacing: 0.15em;
    font-weight: bold;
    padding: 2px 7px;
    border-radius: 2px;
    border: 1px solid currentColor;
    text-transform: uppercase;
}

.bp-pass--info    .bp-status-chip[b-v1f0ydftg7] { color: var(--board-amber);  border-color: var(--board-amber); }
.bp-pass--success .bp-status-chip[b-v1f0ydftg7] { color: var(--theme-success-light); border-color: var(--theme-success-light); }
.bp-pass--warning .bp-status-chip[b-v1f0ydftg7] { color: var(--theme-dark-accent);    border-color: var(--theme-dark-accent); }
.bp-pass--error   .bp-status-chip[b-v1f0ydftg7] { color: var(--theme-danger-light);   border-color: var(--theme-danger-light); }

.bp-pass--info    .bp-header[b-v1f0ydftg7] { border-bottom-color: var(--board-amber); }
.bp-pass--success .bp-header[b-v1f0ydftg7] { border-bottom-color: var(--theme-success); }
.bp-pass--warning .bp-header[b-v1f0ydftg7] { border-bottom-color: var(--theme-dark-btn-bg); }
.bp-pass--error   .bp-header[b-v1f0ydftg7] { border-bottom-color: var(--theme-danger); }

/* Body */
.bp-body[b-v1f0ydftg7] {
    padding: 10px 12px 8px;
}

.bp-route[b-v1f0ydftg7] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.bp-field[b-v1f0ydftg7] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.bp-field--right[b-v1f0ydftg7] {
    align-items: flex-end;
}

.bp-label[b-v1f0ydftg7] {
    font-size: 0.52rem;
    letter-spacing: 0.18em;
    color: var(--theme-light-accent);
    text-transform: uppercase;
    opacity: 0.7;
}

.bp-value[b-v1f0ydftg7] {
    font-size: 0.85rem;
    font-weight: bold;
    color: var(--theme-light-accent);
    letter-spacing: 0.05em;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

.bp-flight[b-v1f0ydftg7] {
    color: var(--theme-light-accent);
    font-size: 0.9rem;
}

.bp-message[b-v1f0ydftg7] {
    font-size: 0.72rem;
    line-height: 1.45;
    color: var(--theme-light-text);
    border-top: 1px dashed var(--theme-light-accent);
    padding-top: 6px;
    margin-top: 4px;
}

/* Perforation tear line */
.bp-perforation[b-v1f0ydftg7] {
    height: 1px;
    background: repeating-linear-gradient(to right, var(--board-frame) 0px, var(--board-frame) 4px, transparent 4px, transparent 8px);
    position: relative;
}

.bp-perforation[b-v1f0ydftg7]::before,
.bp-perforation[b-v1f0ydftg7]::after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--board-frame);
}

.bp-perforation[b-v1f0ydftg7]::before { left: -5px; }
.bp-perforation[b-v1f0ydftg7]::after  { right: -5px; }

/* Stub */
.bp-stub[b-v1f0ydftg7] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px 6px;
    background: var(--theme-light-dropdown-bg);
}

.bp-stub .bp-label[b-v1f0ydftg7] {
    font-size: 0.5rem;
    letter-spacing: 0.2em;
    color: var(--theme-light-accent);
}

.bp-stub-flight[b-v1f0ydftg7] {
    font-size: 0.72rem;
    font-weight: bold;
    color: var(--theme-light-accent);
    letter-spacing: 0.08em;
}

.bp-stub-gate[b-v1f0ydftg7] {
    font-size: 0.85rem;
    font-weight: bold;
    color: var(--theme-light-text);
    letter-spacing: 0.05em;
}

/* Dark mode */
[data-bs-theme=dark] .bp-pass[b-v1f0ydftg7] {
    background: var(--theme-dark-card-bg);
    color: var(--theme-dark-text);
    border-color: var(--theme-dark-accent);
    box-shadow: 0 4px 24px rgba(0,0,0,0.7);
}

[data-bs-theme=dark] .bp-value[b-v1f0ydftg7]   { color: var(--theme-dark-text); }
[data-bs-theme=dark] .bp-label[b-v1f0ydftg7]   { color: rgba(255,255,255,0.55); }
[data-bs-theme=dark] .bp-message[b-v1f0ydftg7] { color: rgba(255,255,255,0.75); border-top-color: var(--theme-dark-dropdown-hover-bg); }
[data-bs-theme=dark] .bp-flight[b-v1f0ydftg7]  { color: var(--theme-dark-accent); }

[data-bs-theme=dark] .bp-stub[b-v1f0ydftg7] {
    background: var(--theme-dark-menu-bg);
}

[data-bs-theme=dark] .bp-stub .bp-label[b-v1f0ydftg7] { color: rgba(255,255,255,0.55); }
[data-bs-theme=dark] .bp-stub-flight[b-v1f0ydftg7]    { color: var(--theme-dark-accent); }
[data-bs-theme=dark] .bp-stub-gate[b-v1f0ydftg7]      { color: var(--theme-dark-text); }

[data-bs-theme=dark] .bp-perforation[b-v1f0ydftg7]::before,
[data-bs-theme=dark] .bp-perforation[b-v1f0ydftg7]::after {
    background: var(--theme-dark-card-bg);
}

/* Text-only mode */
.text-only.bp-pass[b-v1f0ydftg7] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-body-color);
    box-shadow: none;
    border-radius: 4px;
}

.text-only .bp-header[b-v1f0ydftg7] {
    background: transparent;
    border-bottom: 1px solid var(--bs-body-color);
}

.text-only .bp-airline[b-v1f0ydftg7]         { color: var(--bs-body-color); }
.text-only .bp-status-chip[b-v1f0ydftg7]     { color: var(--bs-body-color); border-color: var(--bs-body-color); }
.text-only .bp-value[b-v1f0ydftg7]           { color: var(--bs-body-color); }
.text-only .bp-flight[b-v1f0ydftg7]          { color: var(--bs-body-color); }
.text-only .bp-stub[b-v1f0ydftg7]            { background: transparent; border-top: 1px dashed var(--bs-body-color); }
.text-only .bp-stub-flight[b-v1f0ydftg7],
.text-only .bp-stub-gate[b-v1f0ydftg7]       { color: var(--bs-body-color); }
.text-only .bp-perforation[b-v1f0ydftg7]::before,
.text-only .bp-perforation[b-v1f0ydftg7]::after { background: var(--bs-body-bg); }
/* /Components/Shared/Wizard.razor.rz.scp.css */
.wizard[b-nfdmopc01y] { }
.wizard-body[b-nfdmopc01y] { min-height: 8rem; }
.wizard-footer .btn[b-nfdmopc01y] { min-width: 6rem; }

.stepper[b-nfdmopc01y] {
    gap: .5rem;
}

.step[b-nfdmopc01y] {
    min-width: 80px;
    max-width: 140px;
    position: relative;
    z-index: 2; /* keep steps above the connector line */
}

.step-circle[b-nfdmopc01y] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--theme-secondary);
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
    z-index: 3;
    position: relative;
}

.step-circle .step-number[b-nfdmopc01y] {
    font-weight: 600;
}

    .step-circle.pending[b-nfdmopc01y] {
        background-color: var(--theme-danger);
        color: #fff;
    }

    .step-circle.active[b-nfdmopc01y] {
        background-color: var(--theme-dark-btn-bg);
        color: #fff;
        border-color: var(--theme-light-accent);
        box-shadow: 0 0 0 4px rgba(var(--bs-body-color-rgb, 13,110,253), 1) !important;
    }

.step-circle.completed[b-nfdmopc01y] {
    background-color: var(--theme-light-accent);
    color: var(--theme-dark-text);
    border-color: var(--theme-dark-btn-bg);
}

/* Connector: base track and completed state via pseudo-element.
   It stretches between steps and intentionally extends under the circle
   (negative left/right offsets) so the line visually intersects the circles. */
.connector[b-nfdmopc01y] {
    flex: 1 1 auto;
    min-width: 24px;
    margin: 0 -.5rem;
    position: relative;
    align-self: center;
}

/* base track */
.connector[b-nfdmopc01y]::before {
    content: "";
    position: absolute;
    /* extend left/right half the circle's width (44px / 2 = 22px)
       so the line runs beneath the circles and appears continuous */
    left: -22px;
    right: -22px;
    margin-top:-10px;
    top: 50%;
    transform: translateY(-50%);
    height: 2px;
    background: var(--theme-secondary);
    border-radius: 1px;
    z-index: 1;
}

/* completed connector uses primary color */
.connector.completed[b-nfdmopc01y]::before {
    background: var(--theme-primary);
}

/* Step label styling */
.step-label[b-nfdmopc01y] {
    max-width: 110px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1rem;
}

/* Text-only support: if a parent dialog/container uses the global .text-only class
   remove colored backgrounds and use current text color instead. Use :global()
   so the selector matches an external ancestor when CSS isolation is applied. */
.text-only .wizard .step-circle[b-nfdmopc01y],
.text-only .wizard .step-circle.pending[b-nfdmopc01y] {
    background-color: transparent !important;
    color: inherit !important;
    border-color: currentColor !important;
    box-shadow: none !important;
}

.text-only .wizard .step-circle.active[b-nfdmopc01y] {
    background-color: var(--bs-body-color) !important;
    color: var(--bs-body-bg) !important;
    border-color: currentColor !important;
    box-shadow: 0 0 0 4px rgba(var(--bs-body-color-rgb, 13,110,253), 1) !important;
}
.text-only .wizard .step-circle.completed[b-nfdmopc01y] {
    background-color: var(--bs-body-color) !important;
    color: var(--bs-body-bg) !important;
    border-color: currentColor !important;
    box-shadow: none !important;
}

.text-only .wizard .step-circle .step-number[b-nfdmopc01y],
.text-only .wizard .step-circle i[b-nfdmopc01y] {
    color: inherit !important;
}

/* In text-only mode connectors should not use theme colors - use currentColor at reduced opacity */
.text-only .wizard .connector[b-nfdmopc01y]::before {
    background: currentColor !important;
    opacity: 0.25;
}

/* Responsive: compress on small screens */
@media (max-width: 576px) {
    .step[b-nfdmopc01y] {
        min-width: 56px;
        max-width: 80px;
    }

    .step-label[b-nfdmopc01y] {
        display: none;
    }

    .connector[b-nfdmopc01y] {
        margin: 0 .25rem;
        min-width: 12px;
    }

    /* adjust the overlap for smaller circles if needed */
    .step-circle[b-nfdmopc01y] {
        width: 36px;
        height: 36px;
    }

    .connector[b-nfdmopc01y]::before {
        left: -18px; /* half of 36px */
        right: -18px;
    }
}

/* keep existing styles, only add non-interactive helper */
.step-circle.non-interactive[b-nfdmopc01y] {
    cursor: default;
    pointer-events: none; /* prevent clicks when navigation disabled */
    opacity: 1; /* ensure visual stays same; adjust if you want a faded appearance */
}
/* /Layout/MainLayout.razor.rz.scp.css */
.page[b-y58r1b9x6b] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-y58r1b9x6b] {
    flex: 1;
}

/* ── Shared pill style (used by theme-chooser and scroll-top) ── */
.ma-ui-pill[b-y58r1b9x6b] {
    background: rgba(10, 6, 2, 0.88);
    border: 1px solid var(--theme-dark-accent);
    border-radius: 6px;
    backdrop-filter: blur(2px);
    box-shadow: 0 2px 12px rgba(0,0,0,0.6), 0 0 6px rgba(242,194,75,0.15);
}

/* ── Theme chooser — bottom-right, indented, pill style matching animation controls ── */
.btn-group.theme-chooser[b-y58r1b9x6b] {
    position: fixed !important;
    bottom: clamp(16px, 2vh, 24px);
    right: clamp(16px, 2vw, 24px);
    left: auto !important;
    margin: 0 !important;
    z-index: 1090;
}

.theme-chooser .holder[b-y58r1b9x6b] {
    background: rgba(10, 6, 2, 0.88);
    border: 1px solid var(--theme-dark-accent);
    border-radius: 6px;
    backdrop-filter: blur(2px);
    box-shadow: 0 2px 12px rgba(0,0,0,0.6), 0 0 6px rgba(242,194,75,0.15);
    padding: 0;
    margin: 0;
}

.theme-chooser fieldset[b-y58r1b9x6b] {
    padding: 0 6px 4px;
    padding-block-start: 0;
    margin: 0;
    border: 0;
}

.theme-chooser .btn-group[b-y58r1b9x6b] >  .btn {
    background: transparent !important;
    border: 1px solid var(--theme-dark-accent) !important;
    color: var(--theme-dark-accent) !important;
    border-radius: 4px !important;
    width: 28px;
    height: 28px;
    padding: 0;
    font-size: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 120ms, color 120ms;
}

.theme-chooser .btn-group[b-y58r1b9x6b] >  .btn:hover {
    background: var(--theme-dark-accent) !important;
    color: var(--theme-dark-page-bg) !important;
}

.theme-chooser .btn-group[b-y58r1b9x6b] >  .btn-check:checked + .btn {
    background: var(--theme-dark-accent) !important;
    color: var(--theme-dark-page-bg) !important;
    border-color: var(--theme-dark-btn-bg) !important;
}

[data-bs-theme=light] .theme-chooser .holder[b-y58r1b9x6b] {
    background: rgba(245, 235, 200, 0.75);
    border-color: var(--theme-light-accent);
    backdrop-filter: blur(2px);
}

[data-bs-theme=light] .theme-chooser .btn-group[b-y58r1b9x6b] >  .btn {
    background: transparent !important;
    border-color: var(--theme-light-accent) !important;
    color: var(--theme-light-accent) !important;
}

[data-bs-theme=light] .theme-chooser .btn-group[b-y58r1b9x6b] >  .btn-check:checked + .btn {
    background: var(--theme-light-accent) !important;
    color: var(--theme-light-menu-bg) !important;
    border-color: var(--theme-dark-btn-bg) !important;
}

.text-only .theme-chooser .holder[b-y58r1b9x6b] {
    background: var(--bs-body-bg);
    border-color: var(--bs-border-color);
    box-shadow: none;
    backdrop-filter: none;
}

.text-only .theme-chooser .btn-group[b-y58r1b9x6b] >  .btn {
    background: var(--bs-body-bg) !important;
    border-color: var(--bs-border-color) !important;
    color: var(--bs-body-color) !important;
}

.text-only .theme-chooser .btn-group[b-y58r1b9x6b] >  .btn-check:checked + .btn {
    background: var(--bs-body-color) !important;
    color: var(--bs-body-bg) !important;
    border-color: var(--bs-body-color) !important;
}

@media (max-width: 991px) {
    .btn-group.theme-chooser[b-y58r1b9x6b] {
        display: none !important;
    }
}

.text-only .btn-group-vertical[b-y58r1b9x6b] > .btn-check:checked + .btn {
    background-color: var(--bs-body-color) !important;
    border: 1px solid var(--bs-body-color) !important;
    color: var(--bs-body-bg) !important;
}

.text-only .btn-group-vertical .btn[b-y58r1b9x6b] {
    background-color: var(--bs-body-bg) !important;
    border: 1px solid var(--bs-body-color) !important;
    color: var(--bs-body-color) !important;
}

/* ── Scroll-to-top button — positioned bottom-left ── */
/* Base appearance is in app.css; only text-only override needed here */
.text-only .scroll-top-btn[b-y58r1b9x6b] {
    background: var(--bs-body-bg) !important;
    border: 1px solid var(--bs-border-color) !important;
    color: var(--bs-body-color) !important;
    box-shadow: none !important;
    backdrop-filter: none;
    border-radius: var(--bs-border-radius) !important;
}

.text-only .scroll-top-btn:hover[b-y58r1b9x6b],
.text-only .scroll-top-btn:focus-visible[b-y58r1b9x6b] {
    background: var(--bs-secondary-bg) !important;
}

/* /Sidepanel/Sidepanel.razor.rz.scp.css */

.text-only.offcanvas.bg-primary-subtle[b-b26oazo4si] {
    background-color: var(--bs-body-bg) !important;
    border: solid 1px;
}

.text-only .offcanvas-header[b-b26oazo4si] {
    background-color: var(--bs-body-bg) !important;
    
    border-bottom: var(--bs-card-border-width) solid var(--bs-card-border-color);
}
    .text-only .offcanvas-header .offcanvas-title[b-b26oazo4si] {
        color: var(--bs-body-color);
    }