@font-face {
    font-family: "Khand";
    src: url("../fonts/khand-light-webfont.woff2") format("woff2");
    font-style: normal;
    font-weight: 300;
    font-display: swap;
}

:root {
    --app-font-family: "Khand", "Arial Narrow", sans-serif;
    --mud-typography-default-family: var(--app-font-family) !important;
    --mud-typography-h1-family: var(--app-font-family) !important;
    --mud-typography-h2-family: var(--app-font-family) !important;
    --mud-typography-h3-family: var(--app-font-family) !important;
    --mud-typography-h4-family: var(--app-font-family) !important;
    --mud-typography-h5-family: var(--app-font-family) !important;
    --mud-typography-h6-family: var(--app-font-family) !important;
    --mud-typography-subtitle1-family: var(--app-font-family) !important;
    --mud-typography-subtitle2-family: var(--app-font-family) !important;
    --mud-typography-body1-family: var(--app-font-family) !important;
    --mud-typography-body2-family: var(--app-font-family) !important;
    --mud-typography-button-family: var(--app-font-family) !important;
    --mud-typography-caption-family: var(--app-font-family) !important;
    --mud-typography-overline-family: var(--app-font-family) !important;
}

html,
body,
button,
input,
select,
textarea,
.mud-typography,
.mud-button-root,
.mud-input,
.mud-select,
.mud-chip,
.mud-tab,
.mud-alert,
.mud-snackbar {
    font-family: var(--app-font-family) !important;
}

body {
    font-weight: 300;
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
b {
    font-family: var(--app-font-family);
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

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

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA9NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNFAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDg  </svg>);
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.loading-progress {
    position: absolute;
    display: block;
    width: 8rem;
    height: 8rem;
    inset: 20vh 0 auto 0;
    margin: 0 auto 0 auto;
}

    .loading-progress circle {
        fill: none;
        stroke: #e0e0e0;
        stroke-width: 0.6rem;
        transform-origin: 50% 50%;
        transform: rotate(-90deg);
    }

        .loading-progress circle:last-child {
            stroke: #1b6ec2;
            stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
            transition: stroke-dasharray 0.05s ease-in-out;
        }

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

    .loading-progress-text:after {
        content: var(--blazor-load-percentage-text, "Loading");
    }

.app-loading-screen {
    position: fixed;
    inset: 0;
    z-index: 1300;
    display: grid;
    place-items: center;
    min-height: 100dvh;
    padding: 2rem;
    box-sizing: border-box;
    color: #ebebeb;
    background:
        radial-gradient(circle at 50% 38%, rgba(212, 175, 55, 0.12), transparent 34%),
        linear-gradient(145deg, #1e1e1e 0%, #0d0d0d 100%);
}

.app-loading-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: min(100%, 22rem);
    text-align: center;
}

.app-loading-logo {
    display: block;
    width: min(72vw, 15rem);
    height: auto;
    margin-bottom: 2.25rem;
    filter: drop-shadow(0 0.75rem 1.5rem rgba(0, 0, 0, 0.45));
}

.app-loading-spinner {
    width: 2.75rem;
    height: 2.75rem;
    box-sizing: border-box;
    border: 3px solid rgba(212, 175, 55, 0.2);
    border-top-color: #d4af37;
    border-radius: 50%;
    animation: app-loading-spin 0.85s linear infinite;
}

.app-loading-message {
    margin: 1.25rem 0 0;
    color: rgba(235, 235, 235, 0.88);
    font-family: var(--app-font-family);
    font-size: 1rem;
    font-weight: 300;
    letter-spacing: 0.02em;
}

@keyframes app-loading-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .app-loading-spinner {
        animation-duration: 1.8s;
    }
}

code {
    color: #c02d76;
}

.markdown-content {
    line-height: 1.65;
}

.markdown-content > :first-child {
    margin-top: 0;
}

.markdown-content > :last-child {
    margin-bottom: 0;
}

.markdown-content a {
    color: #d4af37;
}

.markdown-content blockquote {
    margin-left: 0;
    padding-left: 1rem;
    border-left: 3px solid rgba(212, 175, 55, 0.55);
}

.markdown-content code {
    padding: 0.1rem 0.3rem;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.08);
}

.markdown-content .markdown-spacer {
    height: 1.65em;
}

.form-floating > .form-control-plaintext::placeholder,
.form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder,
.form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* --- Pitch/UI: Lounge-Look --- */
.bottom-nav-appbar {
    overflow: visible !important;
}

.bottom-nav-shell {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) 80px repeat(2, minmax(0, 1fr));
    align-items: center;
    width: min(100%, 460px);
    margin: 0 auto;
    overflow: visible;
}

.bottom-nav-center-slot {
    position: relative;
    width: 80px;
    min-height: 46px;
}

.bottom-nav-center-slot::before {
    position: absolute;
    z-index: 0;
    top: -2.85rem;
    left: 50%;
    width: 76px;
    height: 76px;
    content: "";
    transform: translateX(-50%);
    border-radius: 50%;
    background: #0d0d0d;
    pointer-events: none;
}

.bottom-nav-item {
    cursor: pointer;
    color: #b0bec5;
    width: 100%;
    min-width: 0;
    min-height: 46px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 2px;
    transition: color 160ms ease-out, transform 160ms ease-out;
}

.bottom-nav-item.active {
    color: #f1d77a;
    transform: translateY(-2px);
}

.bottom-nav-item.active .nav-icon-wrap {
    width: 42px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(212, 175, 55, 0.22) 0%, rgba(212, 175, 55, 0.08) 45%, transparent 75%);
    box-shadow: 0 0 18px 4px rgba(212, 175, 55, 0.3);
}

.bottom-nav-item.active .nav-icon {
    filter: drop-shadow(0 0 5px rgba(241, 215, 122, 0.7)) drop-shadow(0 0 10px rgba(212, 175, 55, 0.45));
}

.bottom-nav-item.active .nav-label {
    font-weight: 600;
    text-shadow: 0 0 8px rgba(212, 175, 55, 0.75);
}

.bottom-nav-item--lounge {
    grid-column: 1;
}

.bottom-nav-item--rooms {
    grid-column: 2;
}

.bottom-nav-center-slot {
    grid-column: 3;
}

.bottom-nav-item--directions {
    grid-column: 4;
}

.bottom-nav-item--account {
    grid-column: 5;
}

.nav-icon-wrap {
    width: 100%;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: width 160ms ease-out, background-color 160ms ease-out, box-shadow 160ms ease-out;
}

.nav-icon {
    font-size: 22px !important;
    line-height: 1 !important;
    display: block !important;
    margin: 0 auto !important;
}

.nav-label {
    font-size: 0.75rem;
    margin-top: 0;
    line-height: 1.1;
    text-align: center;
    width: 100%;
}

.events-fab {
    position: fixed !important;
    right: max(1rem, env(safe-area-inset-right));
    bottom: calc(5.25rem + env(safe-area-inset-bottom));
    z-index: 1200;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.42) !important;
}

.employee-fab-menu {
    position: fixed !important;
    right: max(1rem, env(safe-area-inset-right));
    bottom: calc(10.5rem + env(safe-area-inset-bottom));
    z-index: 1200;
    width: 56px;
    height: 56px;
}

.employee-admin-fab {
    position: relative !important;
    z-index: 2;
    touch-action: manipulation;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.42) !important;
}

.employee-action-fab {
    position: absolute !important;
    right: 8px;
    bottom: 8px;
    z-index: 1;
    opacity: 0;
    transform: translate(0, 0) scale(0.55);
    transition: transform 180ms ease-out, opacity 140ms ease-out;
    touch-action: manipulation;
    pointer-events: none;
}

.employee-fab-menu--open .employee-action-fab {
    opacity: 1;
    pointer-events: auto;
    transition: transform 160ms ease-out, box-shadow 160ms ease-out !important;
}

.club-card-center-action.active .club-card-center-fab {
    transform: translateY(-3px) scale(1.06);
    box-shadow: 0 0 0 3px rgba(241, 215, 122, 0.32), 0 10px 30px rgba(212, 175, 55, 0.65), 0 5px 14px rgba(0, 0, 0, 0.5) !important;
}

.club-card-center-action.active .club-card-center-label {
    color: #fff2b8;
    font-weight: 600;
    text-shadow: 0 0 8px rgba(212, 175, 55, 0.75);
}

.employee-fab-menu--open .employee-time-tracking-fab {
    transform: translate(-72px, 0) scale(1);
}

.employee-fab-menu--open .employee-vacation-fab {
    transform: translate(-51px, -51px) scale(1);
}

@media (prefers-reduced-motion: reduce) {
    .employee-action-fab {
        transition: none;
    }
}

.club-card-center-action {
    position: absolute;
    left: 50%;
    bottom: 0.35rem;
    z-index: 2;
    display: flex;
    width: 80px;
    flex-direction: column;
    align-items: center;
    transform: translateX(-50%);
    pointer-events: none;
}

.club-card-center-fab {
    position: relative;
    z-index: 1;
    width: 76px !important;
    min-width: 76px !important;
    height: 76px !important;
    color: #0d0d0d !important;
    background-color: #d4af37 !important;
    border: 3px solid #0d0d0d !important;
    box-shadow: 0 8px 24px rgba(212, 175, 55, 0.35), 0 5px 14px rgba(0, 0, 0, 0.5) !important;
    pointer-events: auto;
}

.club-card-center-fab .mud-icon-root {
    font-size: 2rem !important;
}

.club-card-center-label {
    margin-top: 0.1rem;
    color: #f1d77a;
    font-size: 0.75rem;
    line-height: 1;
    text-align: center;
}

.push-notification-prompt {
    position: fixed;
    right: max(1rem, env(safe-area-inset-right));
    bottom: calc(4.75rem + env(safe-area-inset-bottom));
    z-index: 1380;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    width: min(22rem, calc(100vw - 2rem));
    padding: 0.9rem;
    border: 1px solid rgba(212, 175, 55, 0.35);
    border-radius: 16px;
    background: rgba(24, 24, 24, 0.97);
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.42);
    animation: push-notification-prompt-in 220ms ease-out;
}

.push-notification-prompt__icon {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    background: rgba(212, 175, 55, 0.12);
}

.push-notification-prompt__content {
    min-width: 0;
}

@keyframes push-notification-prompt-in {
    from {
        opacity: 0;
        transform: translateY(0.5rem);
    }

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

.app-update-prompt {
    position: fixed;
    left: 50%;
    bottom: calc(5.4rem + env(safe-area-inset-bottom));
    z-index: 1400;
    width: min(24rem, calc(100vw - 2rem));
    padding: 1rem;
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.58);
    border-radius: 18px;
    color: #ebebeb;
    background:
        radial-gradient(circle at 8% 0, rgba(212, 175, 55, 0.2), transparent 38%),
        linear-gradient(145deg, rgba(37, 34, 27, 0.99), rgba(17, 17, 17, 0.99));
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.58), 0 0 28px rgba(212, 175, 55, 0.1);
    transform: translateX(-50%);
    animation: app-update-prompt-in 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.app-update-prompt__accent {
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, transparent, #f1d77a 22%, #b98618 78%, transparent);
}

.app-update-prompt__header {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.app-update-prompt__icon {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border: 1px solid rgba(212, 175, 55, 0.35);
    border-radius: 50%;
    color: #f1d77a;
    background: rgba(212, 175, 55, 0.12);
    box-shadow: inset 0 0 16px rgba(212, 175, 55, 0.08);
}

.app-update-prompt__heading {
    min-width: 0;
}

.app-update-prompt__eyebrow {
    color: #d4af37;
    letter-spacing: 0.12em;
}

.app-update-prompt__message {
    margin: 0.85rem 0 1rem;
    color: rgba(235, 235, 235, 0.84);
}

.app-update-prompt .mud-button-root {
    color: #17130a;
    text-transform: none;
    background: linear-gradient(135deg, #f0d36d, #c99b25);
    box-shadow: 0 8px 20px rgba(212, 175, 55, 0.2);
}

@keyframes app-update-prompt-in {
    from {
        opacity: 0;
        transform: translate(-50%, 0.75rem) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translate(-50%, 0) scale(1);
    }
}

.club-card-coachmark {
    --coachmark-pointer-left: 50%;
    position: fixed;
    z-index: 1390;
    width: min(22rem, calc(100vw - 2rem));
    padding: 1rem 2.5rem 0.8rem 1rem;
    border: 1px solid rgba(212, 175, 55, 0.52);
    border-radius: 14px;
    color: #ebebeb;
    background:
        radial-gradient(circle at 12% 15%, rgba(212, 175, 55, 0.13), transparent 32%),
        linear-gradient(145deg, rgba(37, 34, 27, 0.99), rgba(17, 17, 17, 0.99));
    box-shadow: 0 16px 44px rgba(0, 0, 0, 0.52), 0 0 24px rgba(212, 175, 55, 0.08);
    animation: club-card-coachmark-in 260ms ease-out;
}

.club-card-coachmark::before,
.club-card-coachmark::after {
    content: "";
    position: absolute;
    left: var(--coachmark-pointer-left);
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
}

.club-card-coachmark::before {
    bottom: -13px;
    border-width: 13px 12px 0;
    border-color: rgba(212, 175, 55, 0.52) transparent transparent;
}

.club-card-coachmark::after {
    bottom: -11px;
    border-width: 12px 11px 0;
    border-color: #151411 transparent transparent;
}

.club-card-coachmark-close {
    position: absolute !important;
    top: 0.35rem;
    right: 0.35rem;
    color: rgba(235, 235, 235, 0.7) !important;
}

.club-card-coachmark-icon {
    display: grid;
    flex: 0 0 2.4rem;
    width: 2.4rem;
    height: 2.4rem;
    place-items: center;
    border: 1px solid rgba(212, 175, 55, 0.38);
    border-radius: 50%;
    color: #D4AF37;
    background: rgba(212, 175, 55, 0.08);
}

.club-card-coachmark-title {
    color: #D4AF37;
    line-height: 1.15;
}

.club-card-coachmark-text {
    margin-top: 0.25rem;
    color: rgba(235, 235, 235, 0.86);
    line-height: 1.35;
}

.club-card-coachmark-action {
    min-width: 0 !important;
    margin-top: 0.25rem;
    margin-left: -0.75rem;
    text-transform: none;
}

@keyframes club-card-coachmark-in {
    from {
        opacity: 0;
        transform: translateY(0.75rem) scale(0.97);
    }

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

@media (prefers-reduced-motion: reduce) {
    .club-card-coachmark {
        animation: none;
    }
}

.hero-panel {
    border: 1px solid rgba(212, 175, 55, 0.35);
    background: linear-gradient(145deg, rgba(30, 30, 30, 1) 0%, rgba(20, 20, 20, 1) 100%);
}

.hero-title,
.section-title {
    font-family: var(--app-font-family);
    color: #D4AF37;
}

.opening-table {
    width: 100%;
    border-collapse: collapse;
}

    .opening-table td {
        padding: 0.55rem 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }

        .opening-table td:last-child {
            text-align: right;
            font-weight: 500;
        }

.route-hint {
    border: 1px solid rgba(212, 175, 55, 0.25);
    background-color: rgba(255, 255, 255, 0.02);
}

.lounge-map-card {
    overflow: hidden;
}

.lounge-map {
    position: relative;
    width: 100%;
    height: clamp(20rem, 55vh, 32rem);
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.4);
    border-radius: 8px;
    background: #151515;
}

    .lounge-map::after {
        position: absolute;
        z-index: 10;
        inset: 0;
        display: grid;
        place-items: center;
        content: "Karte wird geladen …";
        color: #D4AF37;
        background: radial-gradient(circle at center, #242424 0%, #151515 70%);
        opacity: 1;
        transition: opacity 300ms ease, visibility 0s linear 300ms;
    }

    .lounge-map--ready::after {
        visibility: hidden;
        opacity: 0;
    }

.lounge-navigation-action {
    display: flex;
    justify-content: center;
}

.event-card {
    border: 1px solid rgba(212, 175, 55, 0.18);
}

.event-timeline {
    display: grid;
    gap: 0.6rem;
}

.event-line-item {
    display: flex;
    justify-content: space-between;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(212, 175, 55, 0.2);
    background: rgba(255, 255, 255, 0.02);
    border-radius: 6px;
}

.event-line-item span:first-child {
    color: #D4AF37;
    font-weight: 600;
}

.event-time-chip {
    height: auto;
    text-align: left;
}

.event-time-chip .mud-chip-content {
    white-space: normal !important;
    display: block !important;
    line-height: 1.25;
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

.event-time-chip-content {
    display: block;
}

.event-line-item .mud-button {
    font-size: 0.78rem;
    padding: 0.2rem 0.55rem;
    min-width: auto;
}

.event-ticket-btn.mud-button-root {
    min-width: 7.5rem !important;   /* überall gleiche Breite */
    height: 1.9rem !important;      /* überall gleiche Höhe */
    padding: 0 0.55rem !important;
    font-size: 0.76rem !important;
    line-height: 1 !important;
    text-transform: none;
}

.event-ticket-btn .mud-button-label {
    white-space: nowrap;
}

.event-line-item .mud-stack {
    width: 100%;
}

.event-location-icon {
    color: #D4AF37;
}

.home-page {
    overflow-anchor: none;
}

.home-logo-wrap {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1rem;
    transition: margin-bottom 550ms cubic-bezier(0.22, 1, 0.36, 1);
}

.home-logo {
    width: min(220px, 70%);
    height: auto;
    display: block;
    transition:
        width 550ms cubic-bezier(0.22, 1, 0.36, 1),
        filter 550ms cubic-bezier(0.22, 1, 0.36, 1);
}

.home-hero {
    position: sticky;
    top: 0;
    z-index: 20;
    margin-bottom: 1rem;
    padding: 1rem;
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.35);
    background: transparent;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
    transition:
        padding 550ms cubic-bezier(0.22, 1, 0.36, 1),
        border-color 550ms cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 550ms cubic-bezier(0.22, 1, 0.36, 1);
}

.home-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(160deg, rgba(34,34,34,0.95) 0%, rgba(18,18,18,0.98) 100%);
    opacity: 1;
    pointer-events: none;
    transition: opacity 550ms cubic-bezier(0.22, 1, 0.36, 1);
}

.home-introduction {
    position: relative;
    z-index: 1;
    max-height: var(--home-introduction-height, 18rem);
    opacity: 1;
    transform: translateY(0);
    transition:
        max-height 550ms cubic-bezier(0.22, 1, 0.36, 1),
        opacity 400ms ease,
        transform 550ms cubic-bezier(0.22, 1, 0.36, 1);
}

.home-hero.home-hero--collapsed {
    padding-block: 0.55rem;
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}

.home-hero.home-hero--collapsed::before {
    opacity: 0;
}

.home-hero--collapsed .home-logo-wrap {
    margin-bottom: 0;
}

.home-hero--collapsed .home-logo {
    width: min(150px, 52%);
    filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.4));
}

.home-hero--collapsed .home-introduction {
    max-height: 0;
    opacity: 0;
    transform: translateY(-0.5rem);
}

.home-title {
    font-family: var(--app-font-family);
    color: #D4AF37;
    letter-spacing: 0.25px;
    text-align: center;
}

.home-subtitle {
    color: rgba(235, 235, 235, 0.88);
    text-align: center;
}

.home-presale-card {
    overflow: hidden;
    border: 1px solid rgba(240, 211, 109, 0.72);
    background:
        radial-gradient(circle at 50% 0, rgba(212, 175, 55, 0.3), transparent 55%),
        linear-gradient(145deg, rgba(48, 39, 22, 0.98), rgba(18, 18, 18, 0.99));
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.42), 0 0 22px rgba(212, 175, 55, 0.13);
}

.home-presale-title {
    color: #f0d36d;
    font-family: var(--app-font-family);
    text-align: center;
    letter-spacing: 0.3px;
}

.home-presale-text {
    color: rgba(248, 245, 235, 0.94);
    text-align: center;
}

.home-presale-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.home-presale-button.mud-button-root {
    min-height: 3.5rem;
    border-radius: 0.75rem;
    font-size: 0.98rem;
    font-weight: 600;
    line-height: 1.15;
    text-transform: none;
    white-space: normal;
    transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.home-presale-button--info.mud-button-root {
    border-color: #d4af37;
    color: #f0d36d;
    background: rgba(212, 175, 55, 0.08);
}

.home-presale-button--tickets.mud-button-root {
    color: #17130a;
    background: linear-gradient(135deg, #f0d36d, #b98216);
    box-shadow: 0 8px 20px rgba(212, 175, 55, 0.24);
}

.home-presale-button.mud-button-root:hover,
.home-presale-button.mud-button-root:focus-visible {
    transform: translateY(-2px);
    filter: brightness(1.08);
}

.home-action-card {
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.38);
    background:
        radial-gradient(circle at 50% 0, rgba(212, 175, 55, 0.18), transparent 58%),
        linear-gradient(145deg, rgba(37, 34, 27, 0.98), rgba(18, 18, 18, 0.98));
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
}

.home-action-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.home-action-grid > :only-child {
    grid-column: 1 / -1;
}

.home-action-button.mud-button-root {
    min-height: 4.25rem;
    padding: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 0.75rem;
    color: #17130a;
    font-size: 1rem;
    line-height: 1.15;
    text-transform: none;
    white-space: normal;
    box-shadow: 0 7px 18px rgba(0, 0, 0, 0.28);
    transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.home-action-button--guide.mud-button-root {
    background: linear-gradient(135deg, #f0d36d, #c99b25);
}

.home-action-button--raffle.mud-button-root {
    background: linear-gradient(135deg, #e5bf4c, #a97612);
}

.home-action-button.mud-button-root:hover,
.home-action-button.mud-button-root:focus-visible {
    transform: translateY(-2px);
    filter: brightness(1.08);
    box-shadow: 0 10px 22px rgba(212, 175, 55, 0.2);
}

.home-action-button .mud-icon-root {
    font-size: 1.55rem;
}

.home-card {
    border: 1px solid rgba(212, 175, 55, 0.2);
    background: linear-gradient(160deg, rgba(30,30,30,0.9) 0%, rgba(22,22,22,0.96) 100%);
}

.home-card-title {
    font-family: var(--app-font-family);
    color: #D4AF37;
}

.home-card-text {
    color: rgba(235, 235, 235, 0.9);
}

.home-info-icon {
    color: #D4AF37;
}

.raffle-page {
    padding-bottom: 2rem;
}

.raffle-loading,
.raffle-empty {
    display: flex;
    min-height: 18rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.raffle-hero {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.4);
    background:
        radial-gradient(circle at 100% 0, rgba(212, 175, 55, 0.28), transparent 45%),
        linear-gradient(145deg, rgba(42, 36, 24, 0.98), rgba(16, 16, 16, 0.98));
}

.raffle-hero::after {
    position: absolute;
    right: -2rem;
    bottom: -4rem;
    color: rgba(212, 175, 55, 0.08);
    font-size: 14rem;
    content: "★";
    pointer-events: none;
}

.raffle-hero-icon {
    display: grid;
    width: 4rem;
    height: 4rem;
    margin-bottom: 1rem;
    place-items: center;
    border-radius: 50%;
    color: #17130a;
    background: linear-gradient(135deg, #f2d779, #b98218);
    box-shadow: 0 8px 24px rgba(212, 175, 55, 0.25);
}

.raffle-title,
.raffle-description,
.raffle-period {
    position: relative;
    z-index: 1;
}

.raffle-description {
    color: rgba(245, 241, 230, 0.9);
    white-space: pre-line;
}

.raffle-period {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #e6cc7d;
}

.raffle-prize-list {
    display: grid;
    gap: 1rem;
}

.raffle-prize-card {
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.22);
    background: linear-gradient(155deg, rgba(35, 32, 26, 0.98), rgba(20, 20, 20, 0.98));
}

.raffle-prize-image-wrap {
    width: 100%;
    aspect-ratio: 16 / 9;
    padding: 1rem;
    background: radial-gradient(circle, rgba(212, 175, 55, 0.12), transparent 68%);
}

.raffle-prize-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.raffle-participation {
    border: 1px solid rgba(212, 175, 55, 0.35);
    background: rgba(25, 23, 19, 0.96);
}

.raffle-confetti-canvas {
    position: fixed;
    z-index: 2000;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .home-hero,
    .home-logo-wrap,
    .home-logo,
    .home-introduction,
    .home-hero::before,
    .home-action-button.mud-button-root {
        transition: none;
    }
}

@media (max-width: 380px) {
    .home-action-grid {
        grid-template-columns: 1fr;
    }
}

.club-card-hero {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.45);
    background:
        radial-gradient(circle at 88% 12%, rgba(212, 175, 55, 0.28), transparent 30%),
        linear-gradient(145deg, #25221b 0%, #111 72%);
}

.club-card-hero::after {
    content: "";
    position: absolute;
    width: 11rem;
    height: 11rem;
    right: -5rem;
    bottom: -7rem;
    border: 1px solid rgba(212, 175, 55, 0.2);
    border-radius: 50%;
}

.club-card-hero-icon {
    float: right;
    color: rgba(212, 175, 55, 0.8);
    font-size: 3rem !important;
}

.club-card-subtitle,
.club-card-validity {
    color: rgba(235, 235, 235, 0.78);
}

.club-card-panel {
    border: 1px solid rgba(212, 175, 55, 0.24);
    background: linear-gradient(160deg, rgba(30, 30, 30, 0.96), rgba(17, 17, 17, 0.99));
}

.club-card-cta {
    text-align: center;
}

.club-card-cta-icon {
    color: #D4AF37;
    font-size: 4rem !important;
    filter: drop-shadow(0 0 1rem rgba(212, 175, 55, 0.22));
}

.club-card-number {
    color: #D4AF37;
    letter-spacing: 0.14em;
}

.club-card-qr {
    width: min(100%, 19rem);
    padding: 1rem;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 0 2rem rgba(212, 175, 55, 0.18);
}

.club-card-qr svg {
    display: block;
    width: 100%;
    height: auto;
}

.club-card-refresh {
    width: min(100%, 19rem);
}

.room-house {
    display: grid;
    width: max(90vw, 100%);
    grid-template-columns: minmax(8.5rem, 0.34fr) minmax(0, 1fr);
    margin-inline: calc((100% - max(90vw, 100%)) / 2);
    scroll-margin-top: 1rem;
    overflow-anchor: none;
    overflow: hidden;
    border-bottom: 2px solid rgba(212, 175, 55, 0.82);
    background: transparent;
    box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.28);
}

.room-roof {
    position: relative;
    grid-column: 1 / -1;
    min-width: 0;
}

.room-house-roof {
    position: relative;
    display: block;
    width: 100%;
    height: clamp(5rem, 11vw, 10rem);
    overflow: hidden;
    padding: 0;
    border: 0;
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
    color: #ebebeb;
    font: inherit;
    background: rgba(212, 175, 55, 0.82);
    cursor: pointer;
    transition: filter 360ms ease;
}

.room-house-roof::before {
    position: absolute;
    inset: 2px 3px;
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
    background:
        repeating-linear-gradient(115deg, transparent 0 1.8rem, rgba(255, 255, 255, 0.035) 1.85rem 1.95rem),
        repeating-linear-gradient(0deg, transparent 0 1.15rem, rgba(212, 175, 55, 0.09) 1.2rem 1.28rem),
        linear-gradient(145deg, #342b20 0%, #17130f 48%, #2b2319 100%);
    content: "";
}

.room-house-roof:hover,
.room-roof.is-active .room-house-roof {
    filter: brightness(1.18);
}

.room-house-roof:focus-visible {
    outline: none;
    filter: brightness(1.25) drop-shadow(0 0 0.35rem #f1d77a);
}

.room-house-roof::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    z-index: 2;
    background: rgba(212, 175, 55, 0.82);
    content: "";
}

.room-house-roof-window {
    position: absolute;
    top: 16%;
    left: 50%;
    width: clamp(1.4rem, 2.6vw, 2.4rem);
    aspect-ratio: 1;
    transform: translateX(-50%) rotate(45deg);
    border: 2px solid rgba(212, 175, 55, 0.7);
    background: radial-gradient(circle at 35% 30%, #594b30, #15130f 68%);
    box-shadow: 0 0 1rem rgba(212, 175, 55, 0.16);
}

.room-house-roof-window::before,
.room-house-roof-window::after {
    position: absolute;
    inset: 50% 0 auto;
    height: 1px;
    background: rgba(212, 175, 55, 0.55);
    content: "";
}

.room-house-roof-window::after {
    transform: rotate(90deg);
}

.room-house-roof-label {
    position: absolute;
    right: 1rem;
    bottom: 0.35rem;
    left: 1rem;
    z-index: 1;
    display: flex;
    gap: 0.75rem;
    align-items: center;
    justify-content: center;
    text-shadow: 0 1px 3px #000;
}

.room-house-roof-heading {
    font-size: 1.12rem;
    font-weight: 600;
    letter-spacing: 0.015em;
}

.room-roof-chevron {
    color: #f1d77a;
    transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.room-roof.is-active .room-roof-chevron {
    transform: rotate(180deg);
}

.room-roof-collapse {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    border-inline: 1px solid rgba(212, 175, 55, 0.34);
    background:
        radial-gradient(circle at 50% 0, rgba(212, 175, 55, 0.12), transparent 42%),
        linear-gradient(145deg, rgba(35, 32, 25, 0.99), rgba(19, 19, 19, 0.99));
    transition: grid-template-rows 520ms cubic-bezier(0.22, 1, 0.36, 1), opacity 360ms ease;
}

.room-roof.is-active .room-roof-collapse {
    grid-template-rows: 1fr;
    opacity: 1;
}

.room-roof-content {
    min-height: 0;
    overflow: hidden;
    padding-inline: 1rem;
}

.room-roof.is-active .room-roof-content {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.room-roof-description {
    text-align: center;
}

.room-house-reveal {
    transform-origin: center;
    animation: room-house-reveal 680ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes room-house-reveal {
    0% {
        clip-path: inset(0 50% round 0.75rem);
        opacity: 0;
        filter: brightness(0.55);
    }

    45% {
        opacity: 1;
    }

    100% {
        clip-path: inset(0);
        opacity: 1;
        filter: brightness(1);
    }
}

.room-stairwell {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 100%;
    overflow: hidden;
    border-left: 2px solid rgba(212, 175, 55, 0.82);
    border-right: 1px solid rgba(212, 175, 55, 0.38);
    background: #17140f;
    transition: width 620ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.room-house.is-stairwell-expanded .room-stairwell {
    width: min(70vw, 28rem);
    box-shadow: 1rem 0 2.5rem rgba(0, 0, 0, 0.58);
}

.room-stairwell-image {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(10, 9, 7, 0.2), rgba(10, 9, 7, 0.82)),
        url("../images/raeumlichkeiten/treppenhaus_2.jpg") center / cover;
    filter: saturate(0.72);
}

.room-stairwell-toggle {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    border: 0;
    color: inherit;
    background: transparent;
    cursor: pointer;
}

.room-stairwell-toggle:focus-visible {
    outline: 2px solid #f1d77a;
    outline-offset: 3px;
}

.room-stairwell-overlay {
    position: sticky;
    top: 1rem;
    z-index: 3;
    display: flex;
    min-height: 13rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.75rem;
    text-align: center;
}

.room-stairwell-icon {
    color: #D4AF37;
    font-size: 2.4rem !important;
}

.room-stairwell-title {
    color: #f1d77a;
}

.room-stairwell-caption {
    color: rgba(255, 255, 255, 0.72);
}

.room-stairwell-expand-icon {
    margin-top: 0.5rem;
    color: #f1d77a;
    transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.room-house.is-stairwell-expanded .room-stairwell-expand-icon {
    transform: rotate(180deg);
}

.room-stairwell-description {
    margin-top: 1rem;
    padding: 0.75rem;
    border: 1px solid rgba(212, 175, 55, 0.2);
    border-radius: 0.5rem;
    color: rgba(255, 255, 255, 0.84);
    text-align: left;
    background: rgba(8, 7, 5, 0.64);
    backdrop-filter: blur(3px);
}

@media (orientation: portrait) {
    .room-stairwell-description {
        max-height: 0;
        margin-top: 0;
        overflow: hidden;
        padding-block: 0;
        border-width: 0;
        opacity: 0;
        transition:
            max-height 520ms cubic-bezier(0.22, 1, 0.36, 1),
            margin 360ms ease,
            padding 360ms ease,
            border-width 360ms ease,
            opacity 260ms ease;
    }

    .room-house.is-stairwell-expanded .room-stairwell-description {
        max-height: 30rem;
        margin-top: 0.75rem;
        padding-block: 0.75rem;
        border-width: 1px;
        opacity: 1;
    }
}

.room-stairwell-levels {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-rows: repeat(3, 1fr);
    pointer-events: none;
}

.room-stairwell-levels span {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding: 0.3rem 0.45rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.38);
    font-size: 0.65rem;
    letter-spacing: 0.08em;
}

.room-stairwell-levels span:last-child {
    border-bottom: 0;
}

.room-floors {
    display: flex;
    min-width: 0;
    flex-direction: column;
    border-right: 2px solid rgba(212, 175, 55, 0.82);
}

.room-floor {
    flex: 1 0 4.25rem;
    min-height: 4.25rem;
    border-bottom: 1px solid rgba(212, 175, 55, 0.18);
    background: linear-gradient(145deg, rgba(31, 30, 27, 0.98), rgba(19, 19, 19, 0.98));
    transition: background 360ms ease, box-shadow 360ms ease;
}

.room-floor:not(.is-active) .room-floor-header {
    height: 100%;
}

.room-floor:last-child {
    border-bottom: 0;
}

.room-floor.is-active {
    flex: 0 0 auto;
    background:
        radial-gradient(circle at 100% 0, rgba(212, 175, 55, 0.13), transparent 36%),
        linear-gradient(145deg, rgba(35, 32, 25, 0.99), rgba(19, 19, 19, 0.99));
    box-shadow: inset 3px 0 #D4AF37;
}

.room-floor-header {
    display: grid;
    width: 100%;
    min-height: 4.25rem;
    grid-template-columns: 3.5rem minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.85rem 1rem;
    border: 0;
    color: #ebebeb;
    font: inherit;
    text-align: left;
    background: transparent;
    cursor: pointer;
}

.room-floor--static .room-floor-header {
    cursor: default;
}

.room-floor-header:focus-visible {
    outline: 2px solid #f1d77a;
    outline-offset: -3px;
}

.room-floor-number {
    color: #D4AF37;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.1em;
}

.room-floor-heading {
    overflow: hidden;
    font-size: 1.12rem;
    font-weight: 600;
    letter-spacing: 0.015em;
    text-overflow: ellipsis;
}

.room-floor-chevron {
    color: rgba(212, 175, 55, 0.8);
    transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.room-floor.is-active .room-floor-chevron {
    transform: rotate(180deg);
}

.room-floor-collapse {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows 520ms cubic-bezier(0.22, 1, 0.36, 1), opacity 360ms ease;
}

.room-floor.is-active .room-floor-collapse {
    grid-template-rows: 1fr;
    opacity: 1;
}

.room-floor-content {
    min-height: 0;
    overflow: hidden;
    padding: 0 1rem;
}

.room-floor.is-active .room-floor-content {
    padding-bottom: 1rem;
}

.room-offers {
    display: grid;
    min-width: 0;
    gap: 0.5rem;
}

.room-roof-content .room-offers {
    padding-top: 0.75rem;
}

.room-offer {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
    overflow: hidden;
    padding: 0.55rem 0.65rem;
    border: 1px solid rgba(212, 175, 55, 0.22);
    border-radius: 0.5rem;
    color: rgba(255, 255, 255, 0.9);
    background: rgba(8, 7, 5, 0.48);
}

.room-roof-content .room-offer {
    display: flex;
    justify-content: center;
    text-align: center;
}

.room-offer-icon {
    color: #f1d77a;
}

.room-offer-label {
    min-width: 0;
    max-width: 100%;
    font-weight: 600;
    letter-spacing: 0.025em;
    overflow-wrap: anywhere;
    white-space: normal;
}

.room-offer.room-offer--menu,
.festival-hall-offer.festival-hall-offer--menu,
.festival-outdoor-offer.festival-outdoor-offer--menu {
    grid-template-columns: 2rem minmax(0, 1fr) auto;
}

.festival-menu-button {
    z-index: 4;
    align-self: center;
    color: #f1d77a !important;
    background: rgba(212, 175, 55, 0.1) !important;
}

.festival-menu-button:hover,
.festival-menu-button:focus-visible {
    background: rgba(212, 175, 55, 0.22) !important;
}

.festival-menu {
    display: grid;
    max-height: min(65dvh, 38rem);
    gap: 0.6rem;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.festival-menu-item {
    padding: 0.7rem 0.8rem;
    border: 1px solid rgba(212, 175, 55, 0.2);
    border-radius: 0.5rem;
    background:
        radial-gradient(circle at 100% 0, rgba(212, 175, 55, 0.09), transparent 42%),
        rgba(255, 255, 255, 0.025);
}

.festival-menu-item-heading {
    display: flex;
    gap: 0.4rem 1rem;
    align-items: baseline;
    justify-content: space-between;
}

.festival-menu-item-name {
    min-width: 0;
    color: rgba(255, 255, 255, 0.94);
    font-weight: 600 !important;
    overflow-wrap: anywhere;
}

.festival-menu-item-price {
    flex: 0 0 auto;
    color: #f1d77a;
    font-weight: 600 !important;
    text-align: right;
}

.festival-menu-item-description {
    display: block;
    margin-top: 0.25rem;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.35 !important;
}

.festival-menu-note {
    margin-top: 0.25rem;
}

.room-photo-placeholder {
    border: 1px dashed rgba(212, 175, 55, 0.45);
    border-radius: 8px;
    min-height: 120px;
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    color: rgba(235, 235, 235, 0.78);
    background: rgba(255, 255, 255, 0.02);
}

.room-gallery {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem;
}

.room-photo {
    width: 100%;
    max-height: 22rem;
    border-radius: 8px;
    border: 1px solid rgba(212, 175, 55, 0.28);
    object-fit: cover;
    background: rgba(255, 255, 255, 0.03);
}

.room-slider {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.28);
    border-radius: 8px;
    background: rgba(8, 7, 5, 0.58);
}

.room-slider-slide {
    position: relative;
    margin: 0;
    animation: room-slider-from-right 360ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.room-slider-slide--from-left {
    animation-name: room-slider-from-left;
}

@keyframes room-slider-from-right {
    from {
        opacity: 0;
        transform: translateX(12%);
    }
}

@keyframes room-slider-from-left {
    from {
        opacity: 0;
        transform: translateX(-12%);
    }
}

.room-slider-photo {
    display: block;
    width: 100%;
    height: clamp(12rem, 42vw, 22rem);
    object-fit: cover;
}

.room-slider-caption {
    position: absolute;
    inset: auto 0 0;
    padding: 2.5rem 3.5rem 1.1rem;
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.25;
    text-align: center;
    text-shadow: 0 1px 3px #000;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.9));
}

.room-slider-button {
    position: absolute;
    z-index: 2;
    top: 50%;
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(241, 215, 122, 0.55);
    border-radius: 50%;
    color: #f1d77a;
    background: rgba(10, 9, 7, 0.76);
    box-shadow: 0 0.25rem 0.8rem rgba(0, 0, 0, 0.35);
    transform: translateY(-50%);
    cursor: pointer;
}

.room-slider-button--previous {
    left: 0.65rem;
}

.room-slider-button--next {
    right: 0.65rem;
}

.room-slider-button:hover,
.room-slider-button:focus-visible {
    color: #fff0ad;
    background: rgba(62, 50, 20, 0.92);
}

.room-slider-button:focus-visible,
.room-slider-dot:focus-visible {
    outline: 2px solid #f1d77a;
    outline-offset: 2px;
}

.room-slider-dots {
    position: absolute;
    z-index: 3;
    right: 0;
    bottom: 0.35rem;
    left: 0;
    display: flex;
    gap: 0.45rem;
    justify-content: center;
}

.room-slider-dot {
    width: 0.45rem;
    height: 0.45rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.55);
    cursor: pointer;
}

.room-slider-dot.is-active {
    background: #f1d77a;
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.35);
}

.festival-outdoor {
    position: relative;
    display: grid;
    width: max(90vw, 100%);
    min-height: 10rem;
    grid-template-columns: minmax(8.5rem, 0.34fr) minmax(0, 1fr);
    margin-inline: calc((100% - max(90vw, 100%)) / 2);
    overflow: hidden;
    border: 2px solid rgba(212, 175, 55, 0.82);
    border-top: 0;
    background: #242424;
    box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.28);
}

.festival-hall {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 10rem;
    overflow: hidden;
    border-right: 1px solid rgba(212, 175, 55, 0.38);
    background:
        repeating-linear-gradient(90deg, transparent 0 1.5rem, rgba(212, 175, 55, 0.05) 1.55rem 1.62rem),
        linear-gradient(145deg, #2d2921, #17140f);
    transition: width 620ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.festival-outdoor.is-hall-expanded .festival-hall {
    width: min(70vw, 28rem);
    box-shadow: 1rem 0 2.5rem rgba(0, 0, 0, 0.58);
}

.festival-hall-toggle {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    border: 0;
    color: inherit;
    background: transparent;
    cursor: pointer;
}

.festival-hall-toggle:focus-visible {
    outline: 2px solid #f1d77a;
    outline-offset: 3px;
}

.festival-hall-overlay {
    position: relative;
    z-index: 3;
    display: flex;
    min-height: 10rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.75rem;
    text-align: center;
}

.festival-hall-icon,
.festival-hall-title,
.festival-hall-expand-icon {
    color: #f1d77a;
}

.festival-hall-icon {
    font-size: 2.4rem !important;
}

.festival-hall-expand-icon {
    margin-top: 0.5rem;
    transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.festival-outdoor.is-hall-expanded .festival-hall-expand-icon {
    transform: rotate(180deg);
}

.festival-hall-offers {
    display: grid;
    width: 100%;
    max-height: 0;
    gap: 0.5rem;
    margin-top: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-0.5rem);
    transition:
        max-height 520ms cubic-bezier(0.22, 1, 0.36, 1),
        margin 360ms ease,
        opacity 260ms ease,
        transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.festival-outdoor.is-hall-expanded .festival-hall-offers {
    max-height: 10rem;
    margin-top: 0.75rem;
    opacity: 1;
    transform: translateY(0);
}

.festival-hall-offer {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
    padding: 0.55rem 0.65rem;
    border: 1px solid rgba(212, 175, 55, 0.25);
    border-radius: 0.5rem;
    color: rgba(255, 255, 255, 0.9);
    overflow: hidden;
    text-align: left;
    background: rgba(8, 7, 5, 0.58);
}

.festival-hall-offer-icon {
    color: #f1d77a;
}

.festival-hall-offer-label {
    min-width: 0;
    max-width: 100%;
    font-weight: 600;
    letter-spacing: 0.035em;
    overflow-wrap: anywhere;
    white-space: normal;
}

.festival-outdoor-area {
    position: relative;
    min-width: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 78% 20%, rgba(212, 175, 55, 0.1), transparent 36%),
        linear-gradient(145deg, #29261f, #191713);
}

.festival-outdoor-area::after {
    position: absolute;
    right: 0;
    bottom: 0;
    width: clamp(3.5rem, 9vw, 6rem);
    height: 100%;
    border-left: 1px solid rgba(212, 175, 55, 0.12);
    background:
        linear-gradient(115deg, transparent 0 27%, rgba(212, 175, 55, 0.22) 28% 29%, transparent 30% 62%, rgba(212, 175, 55, 0.22) 63% 64%, transparent 65%),
        linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.035));
    content: "";
    pointer-events: none;
}

.festival-outdoor-toggle {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    border: 0;
    color: inherit;
    background: transparent;
    cursor: pointer;
}

.festival-outdoor-toggle:focus-visible {
    outline: 2px solid #f1d77a;
    outline-offset: 3px;
}

.festival-outdoor-overlay {
    position: relative;
    z-index: 1;
    display: flex;
    min-height: 10rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem clamp(4.25rem, 10vw, 6.75rem) 1rem 1rem;
    text-align: center;
}

.festival-outdoor-icon,
.festival-outdoor-title,
.festival-outdoor-expand-icon,
.festival-outdoor-offer-icon {
    color: #f1d77a;
}

.festival-outdoor-icon {
    font-size: 2.4rem !important;
}

.festival-outdoor-expand-icon {
    margin-top: 0.5rem;
    transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.festival-outdoor.is-outdoor-expanded .festival-outdoor-expand-icon {
    transform: rotate(180deg);
}

.festival-outdoor-offers {
    display: grid;
    width: 100%;
    max-height: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    margin-top: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-0.5rem);
    transition:
        max-height 620ms cubic-bezier(0.22, 1, 0.36, 1),
        margin 360ms ease,
        opacity 260ms ease,
        transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.festival-outdoor.is-outdoor-expanded .festival-outdoor-offers {
    max-height: 16rem;
    margin-top: 0.75rem;
    opacity: 1;
    transform: translateY(0);
}

.festival-outdoor-offer {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.55rem;
    align-items: center;
    padding: 0.55rem 0.65rem;
    border: 1px solid rgba(212, 175, 55, 0.22);
    border-radius: 0.5rem;
    color: rgba(255, 255, 255, 0.9);
    overflow: hidden;
    text-align: left;
    background: rgba(8, 7, 5, 0.52);
}

.festival-outdoor-offer-label {
    min-width: 0;
    max-width: 100%;
    font-weight: 600;
    letter-spacing: 0.025em;
    overflow-wrap: anywhere;
    white-space: normal;
}

@media (max-width: 600px) {
    .room-house,
    .festival-outdoor {
        grid-template-columns: 7rem minmax(0, 1fr);
    }

    .room-house-roof {
        height: clamp(4rem, 20vw, 6rem);
    }

    .room-house-roof-window {
        display: none;
    }

    .room-house-roof-label {
        right: 0.6rem;
        bottom: 0.4rem;
        left: 0.6rem;
        gap: 0.4rem;
    }

    .room-house-roof-heading {
        font-size: 0.95rem;
    }

    .room-roof-content {
        padding-inline: 0.75rem;
    }

    .room-stairwell-overlay {
        min-height: 10rem;
        padding-inline: 0.5rem;
    }

    .room-stairwell-title {
        font-size: 0.9rem !important;
    }

    .room-stairwell-caption {
        display: none;
    }

    .room-stairwell-description {
        margin-top: 0.6rem;
        padding: 0.45rem;
        font-size: 0.72rem !important;
        line-height: 1.25;
    }

    .room-stairwell-levels span {
        font-size: 0.58rem;
    }

    .room-floor-header {
        min-height: 4rem;
        grid-template-columns: 2.7rem minmax(0, 1fr) auto;
        gap: 0.45rem;
        padding-inline: 0.75rem;
    }

    .room-floor-heading {
        font-size: 1rem;
        white-space: normal;
    }

    .room-floor-content {
        padding-inline: 0.75rem;
    }

    .room-offer {
        grid-template-columns: 1.6rem minmax(0, 1fr);
        gap: 0.4rem;
        padding: 0.45rem;
    }

    .room-offer-label {
        font-size: 0.72rem !important;
        line-height: 1.2;
    }

    .room-offer.room-offer--menu,
    .festival-hall-offer.festival-hall-offer--menu,
    .festival-outdoor-offer.festival-outdoor-offer--menu {
        grid-template-columns: 1.6rem minmax(0, 1fr) auto;
    }

    .festival-menu-item-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .festival-menu-item-price {
        text-align: left;
    }

    .festival-hall-title {
        font-size: 0.9rem !important;
    }

    .festival-hall-offer {
        grid-template-columns: 1.6rem minmax(0, 1fr);
        gap: 0.4rem;
        padding: 0.45rem;
    }

    .festival-hall-offer-label {
        font-size: 0.72rem !important;
        line-height: 1.2;
    }

    .festival-outdoor-overlay {
        padding-right: 4.25rem;
    }

    .festival-outdoor-title {
        font-size: 0.9rem !important;
    }

    .festival-outdoor-offers {
        grid-template-columns: 1fr;
    }

    .festival-outdoor.is-outdoor-expanded .festival-outdoor-offers {
        max-height: 24rem;
    }

    .festival-outdoor-offer {
        grid-template-columns: 1.6rem minmax(0, 1fr);
        gap: 0.4rem;
        padding: 0.45rem;
    }

    .festival-outdoor-offer-label {
        font-size: 0.72rem !important;
        line-height: 1.2;
    }
}

@media (prefers-reduced-motion: reduce) {
    .room-house-reveal,
    .room-stairwell,
    .room-stairwell-description,
    .room-stairwell-expand-icon,
    .room-house-roof,
    .room-roof-chevron,
    .room-roof-collapse,
    .room-floor,
    .room-floor-chevron,
    .room-floor-collapse,
    .room-slider-slide,
    .festival-hall,
    .festival-hall-expand-icon,
    .festival-hall-offers,
    .festival-outdoor-expand-icon,
    .festival-outdoor-offers {
        animation: none;
        transition: none;
    }
}

.consent-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(7, 6, 5, 0.82);
    backdrop-filter: blur(8px);
}

.consent-dialog {
    width: min(100%, 36rem);
    max-height: calc(100dvh - 2rem);
    overflow-y: auto;
    border: 1px solid rgba(198, 160, 93, 0.35);
}

.consent-document {
    max-height: 18rem;
    overflow-y: auto;
    padding-right: 0.5rem;
}

.raffle-consent-document {
    max-height: none;
    overflow-y: visible;
    padding-right: 0;
}

.consent-declined-actions {
    position: fixed;
    right: 1rem;
    bottom: 5.5rem;
    left: 1rem;
    z-index: 1300;
    max-width: 34rem;
    margin-inline: auto;
    border: 1px solid rgba(198, 160, 93, 0.35);
}

.time-tracking-status {
    border: 1px solid rgba(198, 160, 93, 0.32);
    background: linear-gradient(145deg, rgba(198, 160, 93, 0.12), rgba(255, 255, 255, 0.02));
}

.time-tracking-status-label {
    color: var(--mud-palette-primary);
    letter-spacing: 0.12em;
}

.time-tracking-status-value {
    line-height: 1.3;
}

.absence-date-range .absence-calendar-existing,
.absence-date-range .absence-calendar-request,
.absence-date-range .absence-calendar-event {
    color: #fff !important;
    opacity: 1 !important;
}

.absence-date-range .absence-calendar-existing {
    background: #2e7d32 !important;
}

.absence-date-range .absence-calendar-request {
    background: repeating-linear-gradient(135deg, #2e7d32 0 5px, #66a96a 5px 10px) !important;
}

.absence-date-range .absence-calendar-event {
    color: #1a1400 !important;
    background: repeating-linear-gradient(135deg, #d4af37 0 5px, #f1d77a 5px 10px) !important;
}

.absence-calendar-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    font-size: 0.8rem;
}

.absence-calendar-legend > span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.absence-calendar-legend-swatch {
    width: 1rem;
    height: 1rem;
    border-radius: 0.2rem;
}

.absence-calendar-legend-existing {
    background: #2e7d32;
}

.absence-calendar-legend-request {
    background: repeating-linear-gradient(135deg, #2e7d32 0 3px, #66a96a 3px 6px);
}

.absence-calendar-legend-event {
    background: repeating-linear-gradient(135deg, #d4af37 0 3px, #f1d77a 3px 6px);
}

.time-tracking-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.time-tracking-action {
    min-height: 7rem;
    font-size: 1.25rem !important;
    letter-spacing: 0.03em;
}

.time-tracking-action .mud-icon-root {
    font-size: 2rem;
}

.time-tracking-clock-in:not(:disabled) {
    color: #fff;
    background-color: #2e7d32;
}

.time-tracking-clock-in:not(:disabled):hover {
    background-color: #256a2a;
}

.time-tracking-break-start:not(:disabled) {
    color: #0b2633;
    background-color: #4fc3f7;
}

.time-tracking-break-start:not(:disabled):hover {
    background-color: #29b6f6;
}

.time-tracking-break-end:not(:disabled) {
    color: #fff;
    background-color: #1565c0;
}

.time-tracking-break-end:not(:disabled):hover {
    background-color: #0d47a1;
}

.time-tracking-clock-out:not(:disabled) {
    color: #fff;
    background-color: #c62828;
}

.time-tracking-clock-out:not(:disabled):hover {
    background-color: #b71c1c;
}

.time-correction-point {
    min-height: 4rem;
    padding: 0.7rem 1rem !important;
    text-align: left;
    text-transform: none !important;
}

.time-correction-point .mud-button-label {
    width: 100%;
}

.time-correction-point-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: baseline;
    width: 100%;
    column-gap: 1.25rem;
    row-gap: 0.2rem;
}

.time-correction-point-label {
    min-width: 0;
    font-weight: 600;
}

.time-correction-point-time {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    white-space: nowrap;
}

.time-correction-point-requested {
    grid-column: 1 / -1;
    font-size: 0.78rem;
    font-weight: 500;
    opacity: 0.78;
}

@media (max-width: 600px) {
    .time-tracking-actions {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .time-tracking-action {
        min-height: 5.5rem;
    }
}