/* /Components/Layout/AdminLayout.razor.rz.scp.css */
.admin-root[b-n3gshd5unm]{--admin-bg:#070a0b;--admin-panel:#0c1113;--admin-panel-2:#111719;--admin-border:#3c3328;--admin-gold:#b97c2f;--admin-gold-hi:#d19a4a;--admin-text:#e8ddc7;--admin-muted:#afa28e;min-height:100vh;color:var(--admin-text);background:var(--admin-bg);font-family:Inter,system-ui,sans-serif}.admin-topbar[b-n3gshd5unm]{position:fixed;z-index:50;inset:0 0 auto 0;height:68px;display:grid;grid-template-columns:auto 260px minmax(220px,640px) 1fr;align-items:center;gap:1rem;padding:0 1.25rem;border-bottom:1px solid var(--admin-border);background:#080c0dcc}.admin-menu-toggle[b-n3gshd5unm]{width:38px;height:38px;border:1px solid var(--admin-border);color:var(--admin-gold-hi);background:var(--admin-panel);cursor:pointer}.admin-brand[b-n3gshd5unm]{display:flex;flex-direction:column;color:inherit;text-decoration:none}.admin-brand strong[b-n3gshd5unm]{font-family:Cinzel,serif;font-size:.8rem}.admin-brand span[b-n3gshd5unm]{color:var(--admin-gold-hi);font-size:.62rem;letter-spacing:.22em}.admin-search input[b-n3gshd5unm]{width:100%;padding:.7rem .9rem;border:1px solid #302b25;color:var(--admin-text);background:#090d0f}.admin-user[b-n3gshd5unm]{justify-self:end;text-align:right;font-size:.72rem}.admin-user a[b-n3gshd5unm]{display:block;color:var(--admin-muted);text-decoration:none}.admin-sidebar[b-n3gshd5unm]{position:fixed;z-index:40;top:68px;bottom:0;left:0;width:244px;overflow:auto;padding:1rem .7rem 2rem;border-right:1px solid var(--admin-border);background:var(--admin-panel)}.admin-main[b-n3gshd5unm]{min-height:100vh;padding:92px 28px 40px 272px;transition:padding .18s}.is-collapsed .admin-sidebar[b-n3gshd5unm]{width:70px}.is-collapsed .admin-main[b-n3gshd5unm]{padding-left:98px}.is-collapsed[b-n3gshd5unm]  .admin-nav-label,.is-collapsed[b-n3gshd5unm]  .admin-nav-group>span{display:none}.admin-route-loading[b-n3gshd5unm]{min-height:60vh;display:grid;place-content:center;justify-items:center;gap:1rem;color:var(--admin-muted)}.admin-route-loading i[b-n3gshd5unm]{width:28px;height:28px;border:2px solid var(--admin-border);border-top-color:var(--admin-gold-hi);border-radius:50%;animation:spin-b-n3gshd5unm .8s linear infinite}@keyframes spin-b-n3gshd5unm{to{transform:rotate(360deg)}}@media(max-width:800px){.admin-topbar[b-n3gshd5unm]{grid-template-columns:auto 1fr auto}.admin-search[b-n3gshd5unm]{display:none}.admin-sidebar[b-n3gshd5unm]{transform:translateX(-100%)}.admin-main[b-n3gshd5unm]{padding:86px 14px 30px}.admin-root:not(.is-collapsed) .admin-sidebar[b-n3gshd5unm]{transform:none;width:min(280px,82vw);box-shadow:10px 0 40px #000}.admin-root:not(.is-collapsed) .admin-main[b-n3gshd5unm]{padding-left:14px}.admin-user span[b-n3gshd5unm]{display:none}}
/* /Components/Layout/AdminLink.razor.rz.scp.css */
.admin-nav-link[b-0pdi7s0ada]{display:flex;align-items:center;gap:.75rem;min-height:40px;padding:.5rem .7rem;border-left:2px solid transparent;color:#afa28e;text-decoration:none;font-size:.78rem}.admin-nav-link:hover[b-0pdi7s0ada]{color:#e8ddc7;background:#111719}.admin-nav-link.active[b-0pdi7s0ada]{border-left-color:#d19a4a;color:#e8ddc7;background:linear-gradient(90deg,#b97c2f20,transparent)}.admin-nav-link b[b-0pdi7s0ada]{width:22px;color:#b97c2f;text-align:center;font-size:1rem}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
main.page-world[b-yzk681s3sf] {
    background-color: #050807;
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

main.page-world--program[b-yzk681s3sf] {
    background-image:
        linear-gradient(180deg, rgba(4, 8, 14, .12) 0%, rgba(4, 8, 12, .64) 34rem, rgba(3, 7, 8, .88) 100%),
        url('/assets/halloween/backgrounds/berg-en-bos-night.png');
}

main.page-world--festival[b-yzk681s3sf] {
    background-image:
        linear-gradient(180deg, rgba(4, 8, 12, .12) 0%, rgba(5, 8, 10, .67) 34rem, rgba(4, 7, 7, .9) 100%),
        url('/assets/halloween/backgrounds/festival-world.png');
}

main.page-world--account[b-yzk681s3sf] {
    background-image:
        linear-gradient(180deg, rgba(7, 8, 17, .18) 0%, rgba(5, 7, 13, .7) 31rem, rgba(4, 6, 9, .92) 100%),
        url('/assets/halloween/backgrounds/berg-en-bos-night.png');
}

main.page-world--safety[b-yzk681s3sf] {
    background-image:
        linear-gradient(180deg, rgba(5, 10, 13, .2) 0%, rgba(4, 9, 9, .72) 32rem, rgba(3, 7, 7, .92) 100%),
        url('/assets/halloween/backgrounds/berg-en-bos-night.png');
}

main.page-world[b-yzk681s3sf]  .hb-page-hero,
main.page-world[b-yzk681s3sf]  .page-hero.safety-hero {
    background: transparent;
}

main.page-world[b-yzk681s3sf]  .hb-page-hero__scene {
    background-image:
        radial-gradient(circle at 75% 24%, rgba(216, 224, 255, .18), transparent 31%),
        linear-gradient(120deg, rgba(4, 8, 14, .72), rgba(8, 13, 20, .08) 49%, rgba(4, 7, 12, .46));
}

main.page-world--festival[b-yzk681s3sf]  .hb-page-hero__scene {
    background-image:
        radial-gradient(circle at 77% 24%, rgba(255, 179, 77, .15), transparent 28%),
        linear-gradient(122deg, rgba(4, 8, 12, .7), rgba(10, 14, 18, .08) 48%, rgba(4, 7, 10, .5));
}

main.page-world[b-yzk681s3sf]  .hero-to-content {
    background: linear-gradient(to bottom, transparent, rgba(4, 8, 9, .54));
}

/* The legacy mobile rule hides the second hero div; on Veiligheid that div is
   the actual heading rather than decorative artwork. */
main.page-world--safety[b-yzk681s3sf]  .safety-hero > div:nth-child(2) {
    display: block;
    position: relative;
    z-index: 2;
}

@media (max-width: 640px) {
    main.page-world[b-yzk681s3sf] {
        background-attachment: scroll;
    }
}
/* /Components/Layout/NavGroup.razor.rz.scp.css */
.admin-nav-group[b-63gzp7yaiq]{display:grid;gap:.2rem;margin:.7rem 0 1.2rem}.admin-nav-group>span[b-63gzp7yaiq]{padding:.35rem .7rem;color:#786e61;font-size:.58rem;font-weight:800;letter-spacing:.16em}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-mfke1c2ipp],
.components-reconnect-repeated-attempt-visible[b-mfke1c2ipp],
.components-reconnect-failed-visible[b-mfke1c2ipp],
.components-pause-visible[b-mfke1c2ipp],
.components-resume-failed-visible[b-mfke1c2ipp],
.components-rejoining-animation[b-mfke1c2ipp] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

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

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

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

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/MonsterBook/MediaAssetPicker.razor.rz.scp.css */
/* Central MediaAssetPicker: sits ABOVE the edit dialog so the narrow parent
   form never has to scroll and no entered form state is lost on selection. */

.mb-media-field[b-z862i9o9je] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mb-media-preview[b-z862i9o9je] {
    width: 100%;
    max-width: 320px;
    aspect-ratio: 16 / 10;
    border: 1px solid var(--cc-border, #3a3a44);
    border-radius: 8px;
    background: rgba(0, 0, 0, .25);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mb-media-preview img[b-z862i9o9je] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.mb-media-preview--sm[b-z862i9o9je] {
    max-width: 220px;
}

.mb-media-actions[b-z862i9o9je] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.mb-media-empty[b-z862i9o9je] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 12px;
    border: 1px dashed var(--cc-border, #3a3a44);
    border-radius: 8px;
}

.mb-media-empty-text[b-z862i9o9je] {
    opacity: .7;
    font-size: 13px;
}

.mb-media-overlay[b-z862i9o9je] {
    position: fixed;
    inset: 0;
    z-index: 4000;
    background: rgba(8, 6, 14, .82);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.mb-media-dialog[b-z862i9o9je] {
    width: min(1040px, 96vw);
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    background: var(--cc-panel-bg, #17151d);
    border: 1px solid var(--cc-border, #3a3a44);
    border-radius: 12px;
    box-shadow: 0 24px 64px rgba(0, 0, 0, .6);
    overflow: hidden;
}

.mb-media-tabs[b-z862i9o9je] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 18px;
    border-bottom: 1px solid var(--cc-border, #3a3a44);
    flex-wrap: wrap;
}

.mb-media-tab[b-z862i9o9je] {
    background: none;
    border: 0;
    padding: 12px 14px;
    color: inherit;
    opacity: .65;
    cursor: pointer;
    font: inherit;
    border-bottom: 2px solid transparent;
}

.mb-media-tab.is-active[b-z862i9o9je] {
    opacity: 1;
    border-bottom-color: var(--cc-accent, #c9a227);
}

.mb-media-tabs__spacer[b-z862i9o9je] { flex: 1; }

.mb-media-tabs__hint[b-z862i9o9je] {
    font-size: 12px;
    opacity: .6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 260px;
}

.mb-media-feedback[b-z862i9o9je] { margin: 10px 18px 0; }

.mb-media-body[b-z862i9o9je] {
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.mb-media-toolbar[b-z862i9o9je] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.mb-media-toolbar .cc-input[b-z862i9o9je] { flex: 1; }

.mb-media-grid[b-z862i9o9je] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 12px;
}

.mb-media-card[b-z862i9o9je] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px;
    background: rgba(255, 255, 255, .03);
    border: 1px solid var(--cc-border, #3a3a44);
    border-radius: 10px;
    cursor: pointer;
    text-align: left;
    color: inherit;
    font: inherit;
}

.mb-media-card:hover[b-z862i9o9je] { background: rgba(255, 255, 255, .07); }

.mb-media-card.is-selected[b-z862i9o9je] {
    border-color: var(--cc-accent, #c9a227);
    box-shadow: 0 0 0 1px var(--cc-accent, #c9a227) inset;
}

.mb-media-card img[b-z862i9o9je] {
    width: 100%;
    height: 100px;
    object-fit: cover;
    border-radius: 6px;
    background: rgba(0, 0, 0, .3);
}

.mb-media-card__name[b-z862i9o9je] {
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mb-media-card__meta[b-z862i9o9je] {
    font-size: 11px;
    opacity: .6;
}

.mb-dropzone[b-z862i9o9je] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 28px 18px;
    border: 2px dashed var(--cc-border, #3a3a44);
    border-radius: 12px;
    text-align: center;
    transition: border-color .15s ease, background .15s ease;
}

.mb-dropzone.is-drag-over[b-z862i9o9je] {
    border-color: var(--cc-accent, #c9a227);
    background: rgba(201, 162, 39, .08);
}

.mb-dropzone__or[b-z862i9o9je] { opacity: .6; font-size: 12px; }
.mb-dropzone__hint[b-z862i9o9je] { opacity: .6; font-size: 12px; }

.mb-media-note[b-z862i9o9je] {
    margin: 0;
    font-size: 12px;
    opacity: .7;
    line-height: 1.5;
}

.mb-media-filename[b-z862i9o9je] {
    font-size: 12px;
    opacity: .75;
    word-break: break-all;
}

@media (max-width: 640px) {
    .mb-media-overlay[b-z862i9o9je] { padding: 10px; }
    .mb-media-dialog[b-z862i9o9je] { max-height: 96vh; }
    .mb-media-grid[b-z862i9o9je] { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
}
/* /Components/MonsterBook/MonsterBookLeaf.razor.rz.scp.css */
.mb-leaf[b-guxr11n6jp] {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    min-width: 0;
    overflow: hidden;
    color: #281a10;
    background: #d8b576;
    container-type: size;
}

.mb-leaf.is-left[b-guxr11n6jp] { border-radius: 2.5% .8% .8% 2.5%; }
.mb-leaf.is-right[b-guxr11n6jp] { border-radius: .8% 2.5% 2.5% .8%; }

.mb-leaf-paper[b-guxr11n6jp] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background:
        radial-gradient(ellipse at 48% 45%, rgba(255, 238, 187, .14), transparent 58%),
        url('/assets/monsterboek/antique-page-texture.png') center / 100% 100% no-repeat;
    box-shadow: inset 0 0 1px #fff8d9, inset 0 0 30px #5d321b4d;
}

.mb-leaf.is-left .mb-leaf-paper[b-guxr11n6jp] { box-shadow: inset -26px 0 30px #38200f4d, inset 8px 0 18px #fff2c829, inset 0 0 1px #fff8d9; }
.mb-leaf.is-right .mb-leaf-paper[b-guxr11n6jp] { box-shadow: inset 26px 0 30px #38200f4d, inset -8px 0 18px #fff2c829, inset 0 0 1px #fff8d9; }

.mb-print-area[b-guxr11n6jp] {
    position: absolute;
    inset: 7.5% 9.5% 9.2%;
    overflow: hidden;
    font: clamp(10px, 2.15cqh, 19px)/1.48 Georgia, 'Times New Roman', serif;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.mb-leaf.is-left .mb-print-area[b-guxr11n6jp] { right: 11.5%; left: 8.5%; }
.mb-leaf.is-right .mb-print-area[b-guxr11n6jp] { right: 8.5%; left: 11.5%; }

.mb-page-number[b-guxr11n6jp] {
    position: absolute;
    bottom: 4.2%;
    left: 50%;
    transform: translateX(-50%);
    color: #62452c;
    font: 1.7cqh Georgia, serif;
}

.mb-heading-fragment[b-guxr11n6jp] { margin: 0 0 1.1em; text-align: center; }
.mb-heading-fragment span[b-guxr11n6jp], .mb-title-fragment span[b-guxr11n6jp] { display: block; margin-bottom: .5em; color: #815c32; font: 700 .68em Cinzel, Georgia, serif; letter-spacing: .16em; text-transform: uppercase; }
.mb-heading-fragment h2[b-guxr11n6jp] { margin: 0; font: 600 1.42em/1.18 Cinzel, Georgia, serif; text-wrap: balance; }
.mb-heading-fragment p[b-guxr11n6jp] { margin: .45em 0 0; color: #694a31; font-style: italic; }

.mb-title-fragment[b-guxr11n6jp] { display: grid; place-items: center; min-height: 100%; text-align: center; }
.mb-title-fragment h1[b-guxr11n6jp] { margin: .2em 0; font: 600 1.75em/1.12 Cinzel, Georgia, serif; text-wrap: balance; }
.mb-title-fragment p[b-guxr11n6jp] { max-width: 88%; margin: .5em auto; color: #60432c; font-style: italic; }
.mb-title-fragment img[b-guxr11n6jp] { width: 58%; margin-top: 1.2em; filter: sepia(1) saturate(.7) contrast(1.25); }

.mb-paragraph-fragment[b-guxr11n6jp] { margin: 0 0 .82em; }
.mb-paragraph-fragment h3[b-guxr11n6jp], .mb-metadata-fragment h3[b-guxr11n6jp] { margin: 0 0 .35em; font: 600 1.02em Cinzel, Georgia, serif; }
.mb-paragraph-fragment p[b-guxr11n6jp] { margin: 0; white-space: pre-line; }
.mb-paragraph-fragment + .mb-paragraph-fragment:not(:has(h3)) p[b-guxr11n6jp] { text-indent: 1.2em; }

blockquote[b-guxr11n6jp] { margin: .45em .2em 1em; padding: .55em .8em; border-left: 3px solid #8c6335; background: #fff5d26b; font-style: italic; }
figure[b-guxr11n6jp] { margin: .25em 0 .85em; text-align: center; }
figure img[b-guxr11n6jp] { display: block; width: 100%; height: 21em; object-fit: contain; filter: sepia(.08) contrast(1.04); }
figure.is-hero img[b-guxr11n6jp] { height: 16em; }
figcaption[b-guxr11n6jp] { margin-top: .35em; color: #6b4b30; font-size: .72em; font-style: italic; }

.mb-metadata-fragment[b-guxr11n6jp] { margin-bottom: .8em; padding: .55em .65em; border: 1px solid #815a3038; background: #fff5d24d; }
.mb-metadata-fragment dl[b-guxr11n6jp] { margin: 0; }
.mb-metadata-fragment dl div[b-guxr11n6jp] { display: grid; grid-template-columns: 1fr 1fr; gap: .5em; margin: .12em 0; }
.mb-metadata-fragment dt[b-guxr11n6jp] { color: #775228; font-size: .8em; font-weight: 700; }
.mb-metadata-fragment dd[b-guxr11n6jp] { margin: 0; font-size: .82em; text-align: right; }
.mb-page-divider[b-guxr11n6jp] { display: block; width: 52%; margin: .6em auto 1em; filter: sepia(1) contrast(1.25); }
.mb-blank-ornament[b-guxr11n6jp] { position: absolute; top: 50%; left: 50%; width: 35%; opacity: .24; transform: translate(-50%, -50%); filter: sepia(1) contrast(1.3); }

@media (max-width: 620px) {
    .mb-print-area[b-guxr11n6jp] { inset: 7.2% 10% 9%; font-size: clamp(13px, 2.28cqh, 18px); }
    .mb-leaf.is-right .mb-print-area[b-guxr11n6jp] { right: 9.5%; left: 10.5%; }
}
/* /Components/MonsterBook/MonsterBookSheet.razor.rz.scp.css */
/*
    Fysiek vel papier.

    Eén .mb-sheet is één blad met twee echte zijden. De inhoud van beide
    pagina's is een kind van hetzelfde element, dus alles wat het papier
    doet — rotatie om de rug, kromming, schaling, schaduw — gebeurt met de
    inhoud mee. Er bestaat geen losse tekstlaag bovenop het papier.

    De hoek staat in één CSS-variabele (--mb-sheet-angle). In rust zet Blazor
    die op 0deg of -180deg; tijdens het slepen zet JavaScript exact dezelfde
    variabele. Daardoor is er geen spiegelcorrectie, geen scaleX(-1) en geen
    content-swap nodig: de achterkant is simpelweg de andere zijde van
    hetzelfde vel.
*/

.mb-sheet[b-um2aifzv9v] {
    --page-drag-progress: 0;
    --page-drag-x: 0px;
    --page-drag-y: 0px;
    --page-curl-offset-x: 0px;
    --page-curl-offset-y: 0px;
    --page-curl-size: clamp(26px, 7.5%, 40px);
    --page-curl-angle: 0deg;
    --page-curl-opacity: 1;
    --page-fold-shadow: .14;
    --page-under-shadow: .12;
    --page-warp-scale: 1;
    --page-warp-tilt: 0deg;
    --page-warp-roll: 0deg;
    --page-curvature-opacity: 0;
    --page-gutter-opacity: 0;
    --page-sheen-opacity: 0;
    position: absolute;
    top: 0;
    left: var(--mb-sheet-left, 50%);
    z-index: var(--mb-sheet-z, 1);
    width: var(--mb-page-width, 50%);
    height: var(--mb-page-height, 100%);
    transform-origin: left center;
    transform-style: preserve-3d;
    transform: rotateY(var(--mb-sheet-angle, 0deg));
    /* Altijd actief: een hoekwijziging ís de omslaganimatie. */
    transition: transform var(--mb-sheet-duration, 640ms) cubic-bezier(.35, .05, .18, 1);
    will-change: transform;
}

.mb-sheet.is-dragging[b-um2aifzv9v] { z-index: 850; transition: none; }
.mb-sheet.is-completing-drag[b-um2aifzv9v],
.mb-sheet.is-snapping-back[b-um2aifzv9v] { z-index: 850; will-change: transform; }

.mb-sheet-warp[b-um2aifzv9v] {
    position: absolute;
    inset: 0;
    transform-style: preserve-3d;
}

.mb-sheet.is-dragging .mb-sheet-warp[b-um2aifzv9v] {
    transform: scale3d(var(--page-warp-scale), var(--page-warp-scale), 1)
        rotateX(var(--page-warp-tilt)) rotateZ(var(--page-warp-roll));
    transform-origin: bottom right;
}

/*
    De twee zijden van hetzelfde vel. backface-visibility zorgt ervoor dat de
    lezer nooit de verkeerde kant van het papier ziet: de achterkant is 180°
    gedraaid en wordt pas zichtbaar als het vel echt is omgeslagen.
*/
.mb-sheet-face[b-um2aifzv9v] {
    position: absolute;
    inset: 0;
    /* De face is de fysieke grens van het papier. Tijdelijke curl-lagen mogen
       nooit onder de onderrand of buiten de buitenhoek worden geschilderd. */
    overflow: hidden;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.mb-sheet-paper-surface[b-um2aifzv9v] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: inherit;
    backface-visibility: hidden;
}

/* De opkrulling is een afgeronde kwartcirkel binnen het blad. Het paginavlak
   wordt nergens driehoekig uitgeknipt: papier, onderzijde en schaduw blijven
   samen binnen dezelfde fysieke face. */
.mb-interactive-curl[b-um2aifzv9v] {
    position: absolute;
    z-index: 8;
    right: 0;
    bottom: 0;
    width: var(--page-curl-size);
    height: var(--page-curl-size);
    pointer-events: none;
    transform-origin: 100% 100%;
    overflow: hidden;
    border-radius: 100% 0 0 0;
    transform: translate3d(var(--page-curl-offset-x), var(--page-curl-offset-y), 2px)
        rotateZ(var(--page-curl-angle));
    opacity: 0;
    visibility: hidden;
    transform-style: preserve-3d;
    transition: width 220ms cubic-bezier(.2,.72,.2,1), height 220ms cubic-bezier(.2,.72,.2,1),
        transform 220ms cubic-bezier(.2,.72,.2,1), opacity 160ms ease;
}

.mb-interactive-curl > i[b-um2aifzv9v] {
    position: absolute;
    inset: 0;
    display: block;
    pointer-events: none;
}

.mb-curl-fold-front[b-um2aifzv9v] {
    background:
        radial-gradient(circle at 100% 100%, rgba(255, 244, 210, .08) 0 38%, rgba(87, 49, 24, .28) 74%, transparent 76%),
        linear-gradient(138deg, rgba(104, 62, 31, .18), rgba(235, 205, 148, .38) 54%, rgba(116, 72, 38, .18)),
        url('/assets/monsterboek/antique-page-texture.png') right bottom / var(--mb-page-width) var(--mb-page-height) no-repeat;
    border-radius: 100% 0 0 0;
    filter: sepia(.12) brightness(.94) saturate(.9);
    transform: translateZ(1px);
}

.mb-curl-fold-back[b-um2aifzv9v] {
    inset: 10% 0 0 10% !important;
    border-radius: 100% 0 0 0;
    background: radial-gradient(circle at 100% 100%, #9b6b3f 0 22%, #d9bb80 58%, #8b5b34 100%);
    box-shadow: inset 8px -8px 15px #5c351e42;
    transform: translateZ(-1px);
}

.mb-curl-fold-shadow[b-um2aifzv9v] {
    opacity: var(--page-fold-shadow);
    border-radius: 100% 0 0 0;
    background: radial-gradient(circle at 100% 100%, transparent 0 43%, #4a2717 50%, transparent 62%);
    filter: blur(1px);
    transform: translateZ(2px);
}

.mb-curl-under-shadow[b-um2aifzv9v] {
    inset: 4% 1% 1% 4% !important;
    border-radius: 100% 0 0 0;
    opacity: var(--page-under-shadow);
    background: radial-gradient(ellipse at 100% 100%, #3f2114 0 30%, #6d40293d 54%, transparent 70%);
    filter: blur(2.5px);
    transform: translateZ(-2px);
}

/* Een teruggeslagen vel wordt door twee 3D-rotaties weer leesbaar gemaakt.
   Daarom plaatsen we zijn krul expliciet aan de lokale linkerrand: dat is de
   linker buitenhoek van de zichtbare linkerpagina, nooit de middenrug. */
.mb-sheet[data-sheet-turn="backward"] .mb-interactive-curl[b-um2aifzv9v] {
    right: auto;
    left: 0;
    border-radius: 0 100% 0 0;
}

.mb-sheet[data-sheet-turn="backward"] .mb-interactive-curl > i[b-um2aifzv9v],
.mb-sheet[data-sheet-turn="backward"] .mb-curl-fold-front[b-um2aifzv9v],
.mb-sheet[data-sheet-turn="backward"] .mb-curl-fold-back[b-um2aifzv9v],
.mb-sheet[data-sheet-turn="backward"] .mb-curl-fold-shadow[b-um2aifzv9v],
.mb-sheet[data-sheet-turn="backward"] .mb-curl-under-shadow[b-um2aifzv9v] {
    border-radius: 0 100% 0 0;
}

.mb-sheet[data-sheet-turn="backward"] .mb-curl-fold-front[b-um2aifzv9v] {
    background:
        radial-gradient(circle at 0 100%, rgba(255, 244, 210, .08) 0 38%, rgba(87, 49, 24, .28) 74%, transparent 76%),
        linear-gradient(222deg, rgba(104, 62, 31, .18), rgba(235, 205, 148, .38) 54%, rgba(116, 72, 38, .18)),
        url('/assets/monsterboek/antique-page-texture.png') left bottom / var(--mb-page-width) var(--mb-page-height) no-repeat;
}

.mb-sheet[data-sheet-turn="backward"] .mb-curl-fold-back[b-um2aifzv9v] {
    inset: 10% 10% 0 0 !important;
    background: radial-gradient(circle at 0 100%, #9b6b3f 0 22%, #d9bb80 58%, #8b5b34 100%);
    box-shadow: inset -8px -8px 15px #5c351e42;
}

.mb-sheet[data-sheet-turn="backward"] .mb-curl-fold-shadow[b-um2aifzv9v] {
    background: radial-gradient(circle at 0 100%, transparent 0 43%, #4a2717 50%, transparent 62%);
}

.mb-sheet[data-sheet-turn="backward"] .mb-curl-under-shadow[b-um2aifzv9v] {
    inset: 4% 4% 1% 1% !important;
    background: radial-gradient(ellipse at 0 100%, #3f2114 0 30%, #6d40293d 54%, transparent 70%);
}

.mb-sheet.is-turnable .mb-interactive-curl[b-um2aifzv9v] {
    visibility: visible;
    opacity: .68;
}

.mb-sheet.is-curl-hover[b-um2aifzv9v] {
    --page-curl-size: clamp(38px, 10.5%, 58px);
    --page-fold-shadow: .24;
    --page-under-shadow: .22;
}

.mb-sheet.is-curl-hover .mb-interactive-curl[b-um2aifzv9v] { opacity: .96; }

.mb-sheet.is-dragging .mb-interactive-curl[b-um2aifzv9v] {
    visibility: visible;
    opacity: var(--page-curl-opacity);
    transition: none;
}
.mb-sheet.is-turning .mb-interactive-curl[b-um2aifzv9v],
.mb-sheet.is-completing-drag .mb-interactive-curl[b-um2aifzv9v] { opacity: 0; }
.mb-sheet.is-dragging .mb-sheet-curvature[b-um2aifzv9v] { opacity: var(--page-curvature-opacity); }
.mb-sheet.is-dragging .mb-sheet-gutter[b-um2aifzv9v] { opacity: var(--page-gutter-opacity); }
.mb-sheet.is-dragging .mb-sheet-sheen[b-um2aifzv9v] { opacity: var(--page-sheen-opacity); }

.mb-sheet-face.is-front[b-um2aifzv9v] { border-radius: .8% 2.5% 2.5% .8%; }
.mb-sheet-face.is-back[b-um2aifzv9v] { border-radius: 2.5% .8% .8% 2.5%; transform: rotateY(180deg); }

/* Kaft: eigen illustratie op de voorkant. */
.mb-cover-art[b-um2aifzv9v] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: inherit;
    background: #160c07;
    box-shadow: inset 0 0 0 2px #7b552b, inset 0 0 42px #000c;
}

.mb-cover-art img[b-um2aifzv9v] { width: 100%; height: 100%; object-fit: cover; }

/*
    De achterkaft is één kaftdeel met twee eigen vlakken. De binnenzijde is het
    board zoals de lezer het in de laatste spread ziet (dieper en matter); de
    buitenzijde is het volledige board waar het boek op eindigt. De
    aangeleverde afbeeldingen leveren zelf de ornamentiek en de rugbanden.
*/
.mb-cover-art.is-inner-back-cover[b-um2aifzv9v] {
    background: #1c1209;
    box-shadow: inset 0 0 0 2px #6d4a26, inset 0 0 0 10px #00000026, inset 0 0 52px #000e;
}

.mb-cover-art.is-outer-back-cover[b-um2aifzv9v] {
    background: #150c06;
    box-shadow: inset 0 0 0 2px #7b552b, inset 0 0 34px #000b;
}

.mb-cover-art__ridge[b-um2aifzv9v] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 7%;
    background: linear-gradient(90deg, #1b0f07d6, transparent);
}

/* De dikte van het papier langs de buitenrand. */
.mb-sheet-edge[b-um2aifzv9v] {
    position: absolute;
    top: 1.4%;
    bottom: 1.4%;
    right: -3px;
    width: 3px;
    border-radius: 0 2px 2px 0;
    background: linear-gradient(90deg, #c39a5c, #6b4723);
    box-shadow: 0 0 7px #0009;
    opacity: .92;
}

/*
    Kromming en schaduw. Deze lagen zitten ín de zijde zelf, dus ze vervormen
    mee met het papier in plaats van erbovenop te blijven liggen.
*/
.mb-sheet-curvature[b-um2aifzv9v],
.mb-sheet-gutter[b-um2aifzv9v],
.mb-sheet-sheen[b-um2aifzv9v] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0;
}

.mb-sheet-curvature[b-um2aifzv9v] {
    background: linear-gradient(90deg,
            rgba(255, 248, 226, .34) 0%,
            rgba(122, 74, 32, .10) 26%,
            rgba(58, 30, 10, .18) 50%,
            rgba(255, 248, 226, .26) 72%,
            rgba(122, 74, 32, .10) 100%);
}

.mb-sheet-gutter[b-um2aifzv9v] {
    background: linear-gradient(90deg, rgba(32, 17, 6, .66), rgba(32, 17, 6, 0) 27%);
}

.mb-sheet-sheen[b-um2aifzv9v] {
    background: linear-gradient(90deg,
            rgba(255, 255, 255, 0),
            rgba(255, 252, 240, .46) 46%,
            rgba(255, 255, 255, 0) 96%);
}

/*
    Het vel buigt echt in 3D (rotateX/rotateZ op de warp) en komt daardoor
    licht naar de lezer toe (scale). Omdat de inhoud een kind is, buigt de
    tekst mee.
*/
.mb-sheet.is-turning-forward .mb-sheet-warp[b-um2aifzv9v],
.mb-sheet.is-turning-backward .mb-sheet-warp[b-um2aifzv9v] {
    animation: mb-sheet-lift-b-um2aifzv9v var(--mb-turn-duration, 640ms) cubic-bezier(.35, .05, .18, 1) both;
}

.mb-sheet.is-turning-forward .mb-sheet-curvature[b-um2aifzv9v],
.mb-sheet.is-turning-backward .mb-sheet-curvature[b-um2aifzv9v] {
    animation: mb-sheet-curvature-b-um2aifzv9v var(--mb-turn-duration, 640ms) ease-in-out both;
}

.mb-sheet.is-turning-forward .mb-sheet-gutter[b-um2aifzv9v],
.mb-sheet.is-turning-backward .mb-sheet-gutter[b-um2aifzv9v] {
    animation: mb-sheet-gutter-b-um2aifzv9v var(--mb-turn-duration, 640ms) ease-in-out both;
}

.mb-sheet.is-turning-forward .mb-sheet-sheen[b-um2aifzv9v],
.mb-sheet.is-turning-backward .mb-sheet-sheen[b-um2aifzv9v] {
    animation: mb-sheet-sheen-b-um2aifzv9v var(--mb-turn-duration, 640ms) ease-in-out both;
}

@keyframes mb-sheet-lift-b-um2aifzv9v {
    0% { transform: scale3d(1, 1, 1) rotateX(0deg) rotateZ(0deg); }
    45% { transform: scale3d(1.014, 1.012, 1) rotateX(-1.15deg) rotateZ(-.35deg); }
    100% { transform: scale3d(1, 1, 1) rotateX(0deg) rotateZ(0deg); }
}

@keyframes mb-sheet-curvature-b-um2aifzv9v {
    0% { opacity: 0; transform: translateX(0); }
    22% { opacity: .92; }
    50% { opacity: .58; transform: translateX(-2.2%); }
    78% { opacity: .82; }
    100% { opacity: 0; transform: translateX(0); }
}

@keyframes mb-sheet-gutter-b-um2aifzv9v {
    0% { opacity: 0; }
    35% { opacity: .86; }
    100% { opacity: 0; }
}

@keyframes mb-sheet-sheen-b-um2aifzv9v {
    0% { opacity: 0; transform: translateX(-18%); }
    45% { opacity: .52; }
    100% { opacity: 0; transform: translateX(18%); }
}

@media (prefers-reduced-motion: reduce) {
    .mb-sheet[b-um2aifzv9v] { transition-duration: 100ms; }
    .mb-sheet.is-turning-forward .mb-sheet-warp[b-um2aifzv9v],
    .mb-sheet.is-turning-backward .mb-sheet-warp[b-um2aifzv9v],
    .mb-sheet.is-turning-forward .mb-sheet-curvature[b-um2aifzv9v],
    .mb-sheet.is-turning-backward .mb-sheet-curvature[b-um2aifzv9v],
    .mb-sheet.is-turning-forward .mb-sheet-gutter[b-um2aifzv9v],
    .mb-sheet.is-turning-backward .mb-sheet-gutter[b-um2aifzv9v],
    .mb-sheet.is-turning-forward .mb-sheet-sheen[b-um2aifzv9v],
    .mb-sheet.is-turning-backward .mb-sheet-sheen[b-um2aifzv9v] { animation-duration: 100ms; }
    .mb-interactive-curl[b-um2aifzv9v] { transition-duration: 80ms; }
}
/* /Components/Pages/AdminNachtbodeAdvertisements.razor.rz.scp.css */
.ad-cell[b-wlj70247ca] {
    display: flex;
    align-items: center;
    gap: .7rem;
    min-width: 220px;
}

.ad-cell__thumb[b-wlj70247ca] {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--cc-border);
    background: var(--cc-bg-2);
}

.ad-cell__thumb img[b-wlj70247ca] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ad-cell__placeholder[b-wlj70247ca] {
    color: var(--cc-text-dim);
    font-size: .8rem;
}

.ad-cell__text[b-wlj70247ca] {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
}

.ad-cell__text strong[b-wlj70247ca] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 420px;
}

.ad-cell__text small[b-wlj70247ca] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 420px;
    color: var(--cc-text-dim);
    font-size: .7rem;
}

.ad-meta[b-wlj70247ca] {
    white-space: nowrap;
}

.cc-dialog--wide[b-wlj70247ca] {
    max-width: 820px;
}

.ad-editor[b-wlj70247ca] {
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 1.2rem;
    align-items: start;
}

.ad-editor__preview[b-wlj70247ca] {
    display: flex;
    flex-direction: column;
    gap: .4rem;
}

.ad-preview-mini[b-wlj70247ca] {
    background: linear-gradient(180deg, #dccfae, #c4ab7e);
    color: #24180d;
    padding: .7rem .6rem;
    text-align: center;
    border: 1px solid #574124;
}

.ad-preview-mini span[b-wlj70247ca] {
    display: block;
    font-size: .52rem;
    letter-spacing: .2em;
    margin-bottom: .35rem;
    opacity: .8;
}

.ad-preview-mini img[b-wlj70247ca] {
    display: block;
    max-width: 100%;
    max-height: 120px;
    object-fit: contain;
    margin: 0 auto .4rem;
}

.ad-preview-mini strong[b-wlj70247ca] {
    display: block;
    font: 700 .95rem/1.12 "IM Fell English", Georgia, serif;
    word-break: break-word;
}

.ad-preview-mini small[b-wlj70247ca] {
    display: block;
    margin-top: .3rem;
    font-size: .58rem;
    letter-spacing: .08em;
    opacity: .75;
}

.ad-editor__fields .cc-form-row[b-wlj70247ca] {
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
}

.cc-span-all[b-wlj70247ca] {
    grid-column: 1 / -1;
}

@media (max-width: 760px) {
    .ad-editor[b-wlj70247ca] {
        grid-template-columns: 1fr;
    }

    .ad-preview-mini[b-wlj70247ca] {
        max-width: 240px;
    }
}
/* /Components/Pages/AdminNachtbodeLayout.razor.rz.scp.css */
.layout-admin[b-385hfitx2x]{padding:2rem}.layout-admin>header[b-385hfitx2x]{display:flex;justify-content:space-between;gap:1rem}.layout-admin h1[b-385hfitx2x]{margin:.2rem 0;color:#eee0c2}.workspace[b-385hfitx2x]{display:grid;grid-template-columns:210px minmax(450px,1fr) 260px;gap:1rem}.workspace>aside[b-385hfitx2x],.paper-preview[b-385hfitx2x]{padding:1rem;background:#090e0f;border:1px solid #4f3a21}.paper-preview[b-385hfitx2x]{color:#24190f;background:#cbb17e}.paper-preview section>span[b-385hfitx2x]{font-size:.55rem;letter-spacing:.18em}.preview-row[b-385hfitx2x]{display:flex;align-items:stretch;gap:6px;margin:.3rem 0 1rem}.preview-block[b-385hfitx2x]{min-height:100px;padding:.5rem;color:#25190e;background:transparent;border:0;border-right:2px solid rgba(54,37,20,.5);text-align:left}.preview-block strong[b-385hfitx2x],.preview-block small[b-385hfitx2x],.preview-block em[b-385hfitx2x]{display:block}.preview-block.selected[b-385hfitx2x]{outline:3px double #5b3615}.properties label[b-385hfitx2x]{display:grid;gap:.3rem;margin:.7rem 0;color:#d6bd90}.properties input[b-385hfitx2x],.properties select[b-385hfitx2x]{padding:.5rem;color:#eee0c2;background:#050809;border:1px solid #594326}.warning[b-385hfitx2x]{color:#ffc370;background:#241408;padding:.6rem}@media(max-width:1000px){.workspace[b-385hfitx2x]{grid-template-columns:1fr}.paper-preview[b-385hfitx2x]{order:-1}.layout-admin[b-385hfitx2x]{padding:1rem}}
/* /Components/Pages/CC/CCDataBeheer.razor.rz.scp.css */
/* =============================================================
   COMMAND CENTER — DATA BEHEER (export / import)
   Warm bronze + amber accents on the dark ops palette.
   ============================================================= */

.dm-page[b-tbtr6r64ri] {
    --dm-amber: #e08a2e;
    --dm-amber-soft: #f0b45c;
    --dm-bronze: #a8773f;
    --dm-bronze-line: rgba(168, 119, 63, .45);
    --dm-night: #0a1017;
}

/* ---- Two column layout ---- */

.dm-grid[b-tbtr6r64ri] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.1rem;
    align-items: stretch;
}

@media (max-width: 1020px) {
    .dm-grid[b-tbtr6r64ri] { grid-template-columns: minmax(0, 1fr); }
}

/* ---- Panels ---- */

.dm-panel[b-tbtr6r64ri] {
    display: flex;
    flex-direction: column;
    gap: .85rem;
    padding: 1.1rem 1.15rem 1.2rem;
    border: 1px solid var(--dm-bronze-line);
    border-radius: 10px;
    background:
        radial-gradient(120% 80% at 50% 0%, rgba(224, 138, 46, .07), transparent 60%),
        linear-gradient(180deg, #101b22 0%, #0c151b 100%);
    box-shadow: inset 0 1px 0 rgba(255, 214, 160, .05);
}

.dm-panel--export[b-tbtr6r64ri] { border-top: 2px solid var(--dm-amber); }
.dm-panel--import[b-tbtr6r64ri] { border-top: 2px solid #8c2f2f; }

.dm-panel-head[b-tbtr6r64ri] { display: flex; flex-direction: column; gap: .3rem; }

.dm-panel-title[b-tbtr6r64ri] {
    margin: 0;
    font-family: var(--cc-font-display, "Cinzel", Georgia, serif);
    font-size: .95rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--dm-amber-soft);
}

.dm-panel-sub[b-tbtr6r64ri] {
    margin: 0;
    font-size: .74rem;
    line-height: 1.55;
    color: var(--cc-text-muted);
}

/* ---- Illustrations ---- */

.dm-illustration[b-tbtr6r64ri] {
    border: 1px solid var(--dm-bronze-line);
    border-radius: 8px;
    overflow: hidden;
    background: linear-gradient(180deg, #0d141a 0%, #090f14 100%);
}

.dm-illustration svg[b-tbtr6r64ri] { display: block; width: 100%; height: auto; }
.dm-illustration--night[b-tbtr6r64ri] { background: #0b0f14; }

/* ---- Item chips ---- */

.dm-tags[b-tbtr6r64ri] { display: flex; flex-wrap: wrap; gap: .3rem; }

.dm-tag[b-tbtr6r64ri] {
    padding: .22rem .5rem;
    border: 1px solid var(--dm-bronze-line);
    border-radius: 999px;
    background: rgba(224, 138, 46, .07);
    font-size: .58rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--dm-amber-soft);
    white-space: nowrap;
}

.dm-tag--more[b-tbtr6r64ri] { color: var(--cc-text-dim); border-color: var(--cc-border); background: transparent; }

/* ---- Feature highlights ---- */

.dm-features[b-tbtr6r64ri] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
    margin: 0;
    padding: .7rem 0 0;
    border-top: 1px solid var(--cc-border-2);
    list-style: none;
}

.dm-features li[b-tbtr6r64ri] { display: flex; gap: .45rem; align-items: flex-start; }
.dm-features strong[b-tbtr6r64ri] { display: block; font-size: .67rem; color: var(--cc-text); }
.dm-features small[b-tbtr6r64ri] { display: block; font-size: .6rem; color: var(--cc-text-dim); line-height: 1.35; margin-top: .12rem; }

.dm-feature-icon[b-tbtr6r64ri] {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border: 1px solid var(--dm-bronze-line);
    border-radius: 5px;
    font-size: .72rem;
    color: var(--dm-amber);
    background: rgba(224, 138, 46, .08);
}

/* ---- Counters ---- */

.dm-stats[b-tbtr6r64ri] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .4rem;
    margin: 0;
    padding: .6rem 0 0;
    border-top: 1px solid var(--cc-border-2);
}

.dm-stats div[b-tbtr6r64ri] { display: flex; flex-direction: column; gap: .1rem; }
.dm-stats dt[b-tbtr6r64ri] { font-size: .56rem; letter-spacing: .1em; text-transform: uppercase; color: var(--cc-text-dim); }
.dm-stats dd[b-tbtr6r64ri] { margin: 0; font-size: .92rem; color: var(--cc-text); font-variant-numeric: tabular-nums; }

/* ---- Primary actions ---- */

.dm-action[b-tbtr6r64ri] {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: .15rem;
    width: 100%;
    padding: .8rem 1rem;
    border: 1px solid transparent;
    border-radius: 8px;
    cursor: pointer;
    font-family: inherit;
    text-align: center;
    transition: filter .15s ease, transform .1s ease;
}

.dm-action:hover:not(:disabled)[b-tbtr6r64ri] { filter: brightness(1.1); }
.dm-action:active:not(:disabled)[b-tbtr6r64ri] { transform: translateY(1px); }
.dm-action:disabled[b-tbtr6r64ri] { cursor: not-allowed; opacity: .45; }
.dm-action-title[b-tbtr6r64ri] { font-size: .82rem; font-weight: 700; letter-spacing: .14em; color: #1a1206; }
.dm-action-sub[b-tbtr6r64ri] { font-size: .63rem; letter-spacing: .04em; color: rgba(26, 18, 6, .72); }

.dm-action--export[b-tbtr6r64ri] {
    border-color: #f3c07a;
    background: linear-gradient(180deg, #f0a94a 0%, #d1791f 100%);
    box-shadow: 0 0 22px rgba(224, 138, 46, .25);
}

.dm-action--import[b-tbtr6r64ri] {
    border-color: #b8443f;
    background: linear-gradient(180deg, #8f2b2b 0%, #5d1a1a 100%);
}

.dm-action--import .dm-action-title[b-tbtr6r64ri] { color: #ffe9d2; }
.dm-action--import .dm-action-sub[b-tbtr6r64ri] { color: rgba(255, 233, 210, .68); }

/* ---- Import: file input & drop zone ---- */

.dm-file-input[b-tbtr6r64ri] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.dm-dropzone[b-tbtr6r64ri] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    padding: 1.4rem 1rem;
    border: 1.5px dashed var(--dm-bronze-line);
    border-radius: 9px;
    background: rgba(224, 138, 46, .04);
    cursor: pointer;
    text-align: center;
    transition: border-color .15s ease, background .15s ease;
}

.dm-dropzone:hover[b-tbtr6r64ri],
.dm-dropzone.is-drag-over[b-tbtr6r64ri] {
    border-color: var(--dm-amber);
    background: rgba(224, 138, 46, .1);
}

.dm-dropzone-icon[b-tbtr6r64ri] { color: var(--dm-amber); line-height: 0; margin-bottom: .25rem; }
.dm-dropzone-title[b-tbtr6r64ri] { font-size: .8rem; color: var(--cc-text); }
.dm-dropzone-note[b-tbtr6r64ri] { font-size: .68rem; color: var(--cc-text-dim); }

.dm-dropzone-button[b-tbtr6r64ri] {
    margin-top: .55rem;
    padding: .38rem .9rem;
    border: 1px solid var(--dm-bronze-line);
    border-radius: 6px;
    font-size: .62rem;
    letter-spacing: .12em;
    color: var(--dm-amber-soft);
    background: rgba(0, 0, 0, .25);
}

.dm-progress[b-tbtr6r64ri] {
    margin-top: .6rem;
    display: block;
    width: min(280px, 90%);
    height: 5px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .09);
    overflow: hidden;
}

.dm-progress-fill[b-tbtr6r64ri] { display: block; height: 100%; background: linear-gradient(90deg, #d1791f, #f0b45c); transition: width .2s ease; }

/* ---- Import: inspected file summary ---- */

.dm-file-summary[b-tbtr6r64ri] {
    padding: .6rem .7rem;
    border: 1px solid var(--cc-border);
    border-left: 3px solid var(--dm-amber);
    border-radius: 6px;
    background: rgba(255, 255, 255, .02);
}

.dm-file-name[b-tbtr6r64ri] { font-size: .76rem; color: var(--cc-text); word-break: break-all; }
.dm-file-meta[b-tbtr6r64ri] { font-size: .64rem; color: var(--cc-text-dim); margin-top: .15rem; }
.dm-file-sections[b-tbtr6r64ri] { display: flex; flex-wrap: wrap; gap: .28rem; margin-top: .55rem; }

.dm-chip[b-tbtr6r64ri] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .18rem .45rem;
    border: 1px solid var(--cc-border-2);
    border-radius: 4px;
    font-size: .62rem;
    color: var(--cc-text-muted);
    background: rgba(0, 0, 0, .2);
}

.dm-chip strong[b-tbtr6r64ri] { color: var(--dm-amber-soft); font-variant-numeric: tabular-nums; }

/* ---- Warning ---- */

.dm-warning[b-tbtr6r64ri] {
    display: flex;
    gap: .55rem;
    padding: .65rem .75rem;
    border: 1px solid rgba(229, 92, 100, .5);
    border-left: 3px solid var(--cc-danger);
    border-radius: 7px;
    background: rgba(122, 34, 40, .18);
}

.dm-warning-icon[b-tbtr6r64ri] { color: var(--cc-danger); font-size: 1rem; line-height: 1.1; }
.dm-warning strong[b-tbtr6r64ri] { display: block; font-size: .72rem; color: #ffd7d9; }
.dm-warning p[b-tbtr6r64ri] { margin: .28rem 0 0; font-size: .66rem; line-height: 1.55; color: var(--cc-text-muted); }

/* ---- Confirmation ---- */

.dm-confirm[b-tbtr6r64ri] { display: flex; flex-direction: column; gap: .3rem; }
.dm-confirm > span[b-tbtr6r64ri] { font-size: .63rem; color: var(--cc-text-dim); }
.dm-confirm code[b-tbtr6r64ri] { color: var(--dm-amber-soft); letter-spacing: .1em; }

/* ---- Result ---- */

.dm-result[b-tbtr6r64ri] { margin-top: 1rem; }
.dm-result.is-success[b-tbtr6r64ri] { border-left: 3px solid var(--cc-live); }
.dm-result.is-failed[b-tbtr6r64ri] { border-left: 3px solid var(--cc-danger); }
.dm-result .cc-panel-header[b-tbtr6r64ri] { display: flex; align-items: center; justify-content: space-between; }
.dm-result-time[b-tbtr6r64ri] { font-size: .64rem; color: var(--cc-text-dim); font-variant-numeric: tabular-nums; }
.dm-result-message[b-tbtr6r64ri] { margin: .5rem 0; font-size: .76rem; color: var(--cc-text); line-height: 1.6; }

.dm-errors[b-tbtr6r64ri],
.dm-warnings[b-tbtr6r64ri] {
    margin: .4rem 0 0;
    padding-left: 1.1rem;
    font-size: .7rem;
    line-height: 1.6;
}

.dm-errors[b-tbtr6r64ri] { color: var(--cc-danger); }
.dm-warnings[b-tbtr6r64ri] { color: var(--cc-warning); }

/* ---- Bottom overview ---- */

.dm-overview[b-tbtr6r64ri] { margin-top: 1.4rem; }

.dm-overview-title[b-tbtr6r64ri] {
    margin: 0 0 .8rem;
    font-family: var(--cc-font-display, "Cinzel", Georgia, serif);
    font-size: .86rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--dm-amber-soft);
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--dm-bronze-line);
}

.dm-overview-grid[b-tbtr6r64ri] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 1rem;
}

.dm-overview-col header[b-tbtr6r64ri] { display: flex; align-items: center; gap: .4rem; margin-bottom: .45rem; }
.dm-overview-col h3[b-tbtr6r64ri] { margin: 0; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--dm-bronze); }

.dm-overview-icon[b-tbtr6r64ri] {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border: 1px solid var(--dm-bronze-line);
    border-radius: 4px;
    font-size: .66rem;
    color: var(--dm-amber);
}

.dm-overview-col ul[b-tbtr6r64ri] { margin: 0; padding: 0; list-style: none; }

.dm-overview-col li[b-tbtr6r64ri] {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
    padding: .18rem 0;
    font-size: .68rem;
    color: var(--cc-text-muted);
    border-bottom: 1px dotted rgba(38, 52, 59, .7);
}

.dm-overview-col li strong[b-tbtr6r64ri] { color: var(--cc-text); font-weight: 500; font-variant-numeric: tabular-nums; }

/* ---- Note blocks ---- */

.dm-notes[b-tbtr6r64ri] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.2rem;
    padding-top: 1rem;
    border-top: 1px solid var(--cc-border-2);
}

@media (max-width: 900px) {
    .dm-notes[b-tbtr6r64ri] { grid-template-columns: minmax(0, 1fr); }
    .dm-features[b-tbtr6r64ri] { grid-template-columns: minmax(0, 1fr); }
    .dm-stats[b-tbtr6r64ri] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.dm-notes h4[b-tbtr6r64ri] {
    margin: .35rem 0 .3rem;
    font-size: .68rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--dm-amber-soft);
}

.dm-notes p[b-tbtr6r64ri] { margin: 0; font-size: .66rem; line-height: 1.6; color: var(--cc-text-muted); }
.dm-notes code[b-tbtr6r64ri] { color: var(--dm-amber-soft); }

.dm-note-icon[b-tbtr6r64ri] {
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border: 1px solid var(--dm-bronze-line);
    border-radius: 5px;
    font-size: .72rem;
    color: var(--dm-amber);
    background: rgba(224, 138, 46, .07);
}
/* /Components/Pages/CC/CCMonsterboek.razor.rz.scp.css */
.cc-monsterboek .mb-admin-grid[b-9ic8f3vayy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: .9rem;
}

.cc-monsterboek .mb-books-panel[b-9ic8f3vayy],
.cc-monsterboek .mb-chapters-panel[b-9ic8f3vayy],
.cc-monsterboek .mb-blocks-panel[b-9ic8f3vayy],
.cc-monsterboek .mb-preview-panel[b-9ic8f3vayy] {
    min-width: 0;
}

.cc-monsterboek .mb-characters-panel[b-9ic8f3vayy] {
    margin-top: .9rem;
}

.cc-monsterboek .mb-panel-hint[b-9ic8f3vayy] {
    margin: 0 0 .75rem;
    color: var(--cc-text-dim);
    font-size: .72rem;
}

.cc-monsterboek .mb-character-grid[b-9ic8f3vayy] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: .75rem;
}

.cc-monsterboek .mb-character-card[b-9ic8f3vayy] {
    display: grid;
    gap: .5rem;
    border: 1px solid rgba(214, 169, 92, .18);
    border-radius: 10px;
    background: rgba(20, 15, 11, .55);
    padding: .6rem;
    min-width: 0;
}

.cc-monsterboek .mb-character-card-head[b-9ic8f3vayy] {
    display: grid;
    gap: .1rem;
}

.cc-monsterboek .mb-character-card-head small[b-9ic8f3vayy] {
    color: var(--cc-text-dim);
    font-size: .64rem;
}

.cc-monsterboek .mb-character-card-preview[b-9ic8f3vayy] {
    display: grid;
    place-items: center;
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    overflow: hidden;
    background: rgba(0, 0, 0, .35);
}

.cc-monsterboek .mb-character-card-preview img[b-9ic8f3vayy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cc-monsterboek .mb-character-card-empty[b-9ic8f3vayy] {
    color: var(--cc-text-dim);
    font-size: .68rem;
}

.cc-monsterboek .mb-count[b-9ic8f3vayy] {
    font-size: .68rem;
    color: var(--cc-text-dim);
}

.cc-monsterboek .mb-row-selected td[b-9ic8f3vayy] {
    background: rgba(104, 224, 189, .08);
}

.cc-monsterboek .mb-link-button[b-9ic8f3vayy] {
    border: none;
    background: transparent;
    color: inherit;
    display: grid;
    text-align: left;
    gap: .15rem;
    cursor: pointer;
    padding: 0;
}

.cc-monsterboek .mb-link-button small[b-9ic8f3vayy] {
    color: var(--cc-text-dim);
    font-size: .66rem;
}

.cc-monsterboek .mb-inline-sub[b-9ic8f3vayy] {
    display: block;
    color: var(--cc-text-dim);
    font-size: .66rem;
    margin-top: .18rem;
}

.cc-monsterboek .mb-chapter-toolbar[b-9ic8f3vayy] {
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
    margin-bottom: .75rem;
}

.cc-monsterboek .mb-preview-sheet[b-9ic8f3vayy] {
    border: 1px solid rgba(214, 169, 92, .25);
    background: linear-gradient(165deg, rgba(31, 26, 20, .85), rgba(18, 13, 10, .92));
    padding: .95rem;
    color: #f0e0c5;
}

.cc-monsterboek .mb-preview-sheet header span[b-9ic8f3vayy] {
    display: inline-block;
    font-size: .62rem;
    letter-spacing: .11em;
    color: #c8ac78;
    font-weight: 700;
    margin-bottom: .2rem;
}

.cc-monsterboek .mb-preview-sheet header h3[b-9ic8f3vayy] {
    margin: 0;
    font-family: "Cinzel", serif;
    letter-spacing: .04em;
    font-size: 1.02rem;
}

.cc-monsterboek .mb-preview-sheet header p[b-9ic8f3vayy] {
    margin: .35rem 0 .7rem;
    color: #d7c3a2;
    font-size: .78rem;
}

.cc-monsterboek .mb-preview-fragment[b-9ic8f3vayy] {
    margin-bottom: .8rem;
}

.cc-monsterboek .mb-preview-fragment h4[b-9ic8f3vayy] {
    margin: 0 0 .25rem;
    font-size: .82rem;
    color: #f2d9a8;
}

.cc-monsterboek .mb-preview-fragment p[b-9ic8f3vayy] {
    margin: 0;
    color: #ebdfc8;
    font-size: .78rem;
    line-height: 1.5;
}

.cc-monsterboek .mb-preview-fragment blockquote[b-9ic8f3vayy] {
    margin: 0;
    border-left: 3px solid #9f7941;
    padding: .4rem .55rem;
    background: rgba(255, 240, 209, .08);
    color: #f2dfbf;
    font-style: italic;
}

.cc-monsterboek .mb-preview-fragment figure[b-9ic8f3vayy] {
    margin: 0;
}

.cc-monsterboek .mb-preview-fragment img[b-9ic8f3vayy] {
    width: 100%;
    border: 1px solid rgba(217, 171, 102, .4);
    max-height: 200px;
    object-fit: cover;
}

.cc-monsterboek .mb-preview-fragment figcaption[b-9ic8f3vayy] {
    margin-top: .25rem;
    color: #c7ad84;
    font-size: .68rem;
}

.cc-monsterboek .mb-preview-fragment dl[b-9ic8f3vayy] {
    margin: 0;
    display: grid;
    gap: .18rem;
}

.cc-monsterboek .mb-preview-fragment dl div[b-9ic8f3vayy] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .3rem;
}

.cc-monsterboek .mb-preview-fragment dt[b-9ic8f3vayy],
.cc-monsterboek .mb-preview-fragment dd[b-9ic8f3vayy] {
    margin: 0;
    font-size: .7rem;
}

.cc-monsterboek .mb-preview-fragment dd[b-9ic8f3vayy] {
    text-align: right;
}

.cc-monsterboek .cc-dialog--wide[b-9ic8f3vayy] {
    max-width: 860px;
}

/* ── Chapter editor ────────────────────────────────────────────────────────
   Een volledig hoofdstuk past niet in een smalle modal: gebruik de
   beschikbare ruimte, met de actiebalk blijvend onderaan. */
.cc-monsterboek .cc-dialog--chapter[b-9ic8f3vayy] {
    display: flex;
    flex-direction: column;
    width: min(1100px, 94vw);
    max-width: min(1100px, 94vw);
    height: min(900px, 94vh);
    max-height: min(900px, 94vh);
    overflow: hidden;
}

.cc-monsterboek .cc-dialog--chapter .cc-dialog-header[b-9ic8f3vayy] {
    flex: 0 0 auto;
}

/* Alleen de inhoud scrolt, zodat de knoppen altijd bereikbaar blijven. */
.cc-monsterboek .cc-dialog--chapter .cc-dialog-body[b-9ic8f3vayy] {
    flex: 1 1 auto;
    overflow-y: auto;
}

.cc-monsterboek .cc-dialog-footer--sticky[b-9ic8f3vayy] {
    flex: 0 0 auto;
    position: sticky;
    bottom: 0;
    background: var(--cc-panel);
    border-top: 1px solid var(--cc-border);
}

.cc-monsterboek .cc-section-title[b-9ic8f3vayy] {
    margin: 1.15rem 0 .6rem;
    padding-bottom: .3rem;
    border-bottom: 1px solid var(--cc-border);
    font: 700 .66rem 'Cinzel', serif;
    letter-spacing: .12em;
    color: var(--cc-text-dim);
}

.cc-monsterboek .cc-section-title:first-child[b-9ic8f3vayy] {
    margin-top: 0;
}

/* Groot tekstveld voor het plakken van complete hoofdstukken. */
.cc-monsterboek .cc-textarea--chapter[b-9ic8f3vayy] {
    min-height: 340px;
    height: 42vh;
    max-height: 70vh;
    resize: vertical;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: .82rem;
    line-height: 1.55;
    white-space: pre-wrap;
}

.cc-monsterboek .cc-editor-meta[b-9ic8f3vayy] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: .3rem;
    font-size: .68rem;
    color: var(--cc-text-dim);
}

@media (max-width: 760px) {
    .cc-monsterboek .cc-dialog--chapter[b-9ic8f3vayy] {
        width: 100vw;
        max-width: 100vw;
        height: 94dvh;
        max-height: 94dvh;
    }

    .cc-monsterboek .cc-textarea--chapter[b-9ic8f3vayy] {
        min-height: 260px;
        height: 38vh;
    }
}

.cc-monsterboek .cc-check-row[b-9ic8f3vayy] {
    display: flex;
    gap: .8rem;
    flex-wrap: wrap;
}

.cc-monsterboek .cc-check-label[b-9ic8f3vayy] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    color: var(--cc-text-muted);
}

.cc-monsterboek .mb-chapter-target[b-9ic8f3vayy] {
    margin: 0 0 .6rem;
    padding: .45rem .6rem;
    border: 1px solid rgba(212, 173, 110, .35);
    background: rgba(212, 173, 110, .08);
    color: var(--cc-text, #d8eaf2);
    font-size: .76rem;
}

.cc-monsterboek .mb-delete-copy[b-9ic8f3vayy] {
    margin: 0 0 .5rem;
    color: var(--cc-text-muted);
    font-size: .8rem;
}

@media (max-width: 1280px) {
    .cc-monsterboek .mb-admin-grid[b-9ic8f3vayy] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/CC/CCRouteDesigner.razor.rz.scp.css */
.route-designer-page[b-i2gcrguqj5] {
    --rd-bg-main: #07141c;
    --rd-bg-panel: #0b1b24;
    --rd-bg-panel-alt: #0e202a;
    --rd-border: #1a3a49;
    --rd-border-hover: #28576a;
    --rd-text: #d8eaf2;
    --rd-text-dim: #8eaab8;
    --rd-text-muted: #66838f;
    --rd-cyan: #38b6ff;
    --rd-teal: #22d9c3;
    --rd-green: #40d98a;
    --rd-orange: #f59a2a;
    --rd-red: #ff4d43;
    color: var(--rd-text);
}

.route-designer-page :is(.cc-panel, .cc-input, .cc-select, .cc-button)[b-i2gcrguqj5] {
    border-radius: 5px;
}

.rd-toolbar[b-i2gcrguqj5] {
    display: grid;
    grid-template-columns: minmax(240px, 2.3fr) minmax(170px, 1.3fr) minmax(180px, 1.2fr) minmax(130px, .9fr) repeat(2, minmax(130px, .8fr));
    gap: .75rem;
    align-items: end;
    margin-bottom: .9rem;
    background: linear-gradient(180deg, rgba(11, 27, 36, .96), rgba(11, 27, 36, .91));
    border: 1px solid var(--rd-border);
}

.rd-field[b-i2gcrguqj5] {
    display: grid;
    gap: .35rem;
}

.rd-name[b-i2gcrguqj5] {
    min-width: 0;
}

.rd-color-row[b-i2gcrguqj5] {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: .45rem;
}

.rd-color-row input[type="color"][b-i2gcrguqj5] {
    width: 42px;
    height: 36px;
    border: 1px solid var(--rd-border);
    padding: 0;
    background: #0a1820;
}

.rd-metric[b-i2gcrguqj5] {
    display: grid;
    gap: .2rem;
    min-height: 38px;
}

.rd-metric span[b-i2gcrguqj5] {
    font-size: .68rem;
    color: var(--rd-text-muted);
    letter-spacing: .07em;
}

.rd-metric strong[b-i2gcrguqj5] {
    color: var(--rd-cyan);
    font-size: 1.1rem;
}

.rd-layout[b-i2gcrguqj5] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 368px);
    gap: .9rem;
    align-items: start;
}

.rd-map-shell[b-i2gcrguqj5] {
    background: var(--rd-bg-panel);
    border: 1px solid var(--rd-border);
    position: relative;
    min-height: 720px;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: .65rem;
    padding: .7rem;
}

.rd-modebar[b-i2gcrguqj5] {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .65rem;
    align-items: center;
    justify-content: space-between;
}

.rd-mode-group[b-i2gcrguqj5] {
    display: flex;
    gap: .45rem;
    flex-wrap: wrap;
}

.rd-network-status[b-i2gcrguqj5] {
    color: var(--rd-text-dim);
    font-size: .72rem;
}

.rd-map[b-i2gcrguqj5] {
    min-height: 560px;
    width: 100%;
    border: 1px solid #27414d;
    background: #091821;
}

.rd-helper[b-i2gcrguqj5] {
    position: absolute;
    left: 1.35rem;
    bottom: 5.2rem;
    background: rgba(8, 21, 29, .92);
    border: 1px solid #2f4f5e;
    padding: .6rem .72rem;
    display: grid;
    gap: .2rem;
    max-width: 360px;
    pointer-events: none;
}

.rd-helper strong[b-i2gcrguqj5] {
    color: var(--rd-orange);
    font-size: .86rem;
}

.rd-helper span[b-i2gcrguqj5] {
    color: var(--rd-text-dim);
    font-size: .74rem;
}

.rd-style-switcher[b-i2gcrguqj5] {
    position: absolute;
    right: 1.2rem;
    bottom: 4.9rem;
    display: flex;
    gap: .42rem;
}

.rd-actions[b-i2gcrguqj5] {
    display: grid;
    grid-template-columns: auto auto auto minmax(220px, 1fr);
    gap: .55rem;
    align-items: center;
}

.rd-action-hint[b-i2gcrguqj5] {
    justify-self: end;
    font-size: .75rem;
    color: var(--rd-text-dim);
    text-align: right;
}

.rd-side[b-i2gcrguqj5] {
    background: var(--rd-bg-panel-alt);
    border: 1px solid var(--rd-border);
    display: grid;
    gap: .8rem;
    max-height: 85vh;
    overflow: auto;
}

.rd-side-subtitle[b-i2gcrguqj5] {
    margin-top: -.45rem;
    margin-bottom: .2rem;
    color: var(--rd-text-dim);
    font-size: .76rem;
}

.rd-boundary[b-i2gcrguqj5],
.rd-points[b-i2gcrguqj5],
.rd-validation[b-i2gcrguqj5] {
    border: 1px solid var(--rd-border);
    background: rgba(8, 24, 33, .75);
    padding: .65rem;
}

.rd-boundary h3[b-i2gcrguqj5],
.rd-points h3[b-i2gcrguqj5] {
    margin: 0;
    font-size: .88rem;
    letter-spacing: .05em;
    color: #e7f3f7;
}

.rd-boundary p[b-i2gcrguqj5] {
    margin: .28rem 0 .62rem;
    font-size: .73rem;
    color: var(--rd-text-dim);
}

.rd-inline-actions[b-i2gcrguqj5] {
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
    margin-bottom: .6rem;
}

.rd-boundary-grid[b-i2gcrguqj5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .4rem;
}

.rd-boundary-grid div[b-i2gcrguqj5] {
    border: 1px solid var(--rd-border);
    padding: .42rem;
    display: grid;
    gap: .15rem;
}

.rd-boundary-grid span[b-i2gcrguqj5] {
    font-size: .69rem;
    color: var(--rd-text-muted);
}

.rd-boundary-grid strong[b-i2gcrguqj5] {
    font-size: .82rem;
    color: var(--rd-text);
}

.rd-points-header[b-i2gcrguqj5] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: .45rem;
}

.rd-points-header span[b-i2gcrguqj5] {
    font-size: .72rem;
    color: var(--rd-cyan);
}

.rd-point-list[b-i2gcrguqj5] {
    display: grid;
    gap: .45rem;
    margin-top: .55rem;
}

.rd-point[b-i2gcrguqj5] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: .42rem;
    border: 1px solid var(--rd-border);
    padding: .42rem;
    align-items: start;
}

.rd-point.selected[b-i2gcrguqj5] {
    border-color: var(--rd-cyan);
    box-shadow: 0 0 0 1px rgba(56, 182, 255, .45) inset;
}

.rd-point-index[b-i2gcrguqj5] {
    height: 32px;
    border: 1px solid #2b4f5e;
    background: #0a1820;
    color: var(--rd-cyan);
    cursor: pointer;
}

.rd-point-body[b-i2gcrguqj5] {
    display: grid;
    gap: .16rem;
    min-width: 0;
}

.rd-point-body small[b-i2gcrguqj5] {
    color: var(--rd-text-dim);
    font-size: .69rem;
    line-height: 1.2;
}

.rd-point-actions[b-i2gcrguqj5] {
    display: grid;
    gap: .3rem;
}

.rd-empty[b-i2gcrguqj5] {
    margin: 0;
    color: var(--rd-text-dim);
    font-size: .75rem;
}

.rd-validation .ok[b-i2gcrguqj5] {
    margin: 0;
    color: var(--rd-green);
    font-weight: 600;
}

.rd-validation .error[b-i2gcrguqj5] {
    margin: 0 0 .4rem;
    color: var(--rd-red);
    font-weight: 600;
}

.rd-validation ul[b-i2gcrguqj5] {
    margin: 0;
    padding-left: 1.1rem;
    color: var(--rd-text-dim);
    font-size: .73rem;
}

@media (max-width: 1260px) {
    .rd-toolbar[b-i2gcrguqj5] {
        grid-template-columns: repeat(2, minmax(190px, 1fr));
    }

    .rd-layout[b-i2gcrguqj5] {
        grid-template-columns: minmax(0, 1fr);
    }

    .rd-side[b-i2gcrguqj5] {
        max-height: unset;
    }
}

@media (max-width: 860px) {
    .rd-actions[b-i2gcrguqj5] {
        grid-template-columns: 1fr;
    }

    .rd-action-hint[b-i2gcrguqj5] {
        justify-self: start;
        text-align: left;
    }

    .rd-helper[b-i2gcrguqj5] {
        position: static;
        max-width: unset;
        pointer-events: auto;
        margin-top: .55rem;
    }

    .rd-style-switcher[b-i2gcrguqj5] {
        position: static;
        margin-top: .4rem;
    }

    .rd-map-shell[b-i2gcrguqj5] {
        min-height: 620px;
    }

    .rd-map[b-i2gcrguqj5] {
        min-height: 480px;
    }
}
/* /Components/Pages/CmsNachtbodeEditor.razor.rz.scp.css */
/* Styles for the BodySource textarea and auto-format controls in the CMS editor. */

.form-group--bodysource[b-g0lbbc80lh] {
    border: 1px solid var(--cc-border, #555);
    border-radius: 4px;
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.03);
}

.form-group--bodysource label[b-g0lbbc80lh] {
    font-weight: 700;
    font-size: 0.85rem;
    margin-bottom: 0.2rem;
}

.form-hint[b-g0lbbc80lh] {
    font-size: 0.75rem;
    color: var(--cc-text-dim, #888);
    margin: 0 0 0.5rem;
    line-height: 1.4;
}

.form-group--bodysource textarea[b-g0lbbc80lh] {
    width: 100%;
    min-height: 200px;
    font-family: "Cascadia Code", "Fira Code", monospace;
    font-size: 0.82rem;
    line-height: 1.55;
    padding: 0.6rem;
    border: 1px solid var(--cc-border, #555);
    border-radius: 3px;
    background: var(--cc-bg, #1e1e1e);
    color: var(--cc-text, #ddd);
    resize: vertical;
    tab-size: 4;
}

.bodysource-actions[b-g0lbbc80lh] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-top: 0.5rem;
}

.bodysource-hint[b-g0lbbc80lh] {
    font-size: 0.72rem;
    color: var(--cc-text-dim, #888);
}
/* /Components/Pages/CmsNachtbodeVoorpagina.razor.rz.scp.css */
.frontpage-cms[b-r3k1js7yeq] { max-width: 1280px; margin: 0 auto; padding: 2rem; }
.settings-grid[b-r3k1js7yeq] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.cms-panel[b-r3k1js7yeq] { padding: 1.4rem; border: 1px solid rgba(201,146,60,.35); background: #0b1112; }
.cms-panel h2[b-r3k1js7yeq] { color: #e9dcc1; }
.cms-panel label[b-r3k1js7yeq] { display: grid; gap: .35rem; margin: .8rem 0; color: #c9b58f; }
.cms-panel input:not([type=checkbox])[b-r3k1js7yeq], .cms-panel textarea[b-r3k1js7yeq], .cms-panel select[b-r3k1js7yeq] { width: 100%; padding: .7rem; color: #eee1c5; border: 1px solid #554125; background: #070a0c; }
.cms-panel textarea[b-r3k1js7yeq] { min-height: 6rem; }
.cms-panel img[b-r3k1js7yeq] { width: 100%; max-height: 250px; object-fit: cover; border: 1px solid #755225; }
.focal-grid[b-r3k1js7yeq], .announcement-fields[b-r3k1js7yeq] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.announcements-editor[b-r3k1js7yeq] { margin-top: 1.5rem; }
.announcements-editor > header[b-r3k1js7yeq] { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.announcement-row[b-r3k1js7yeq] { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #45351f; }
.row-actions[b-r3k1js7yeq] { display: flex; gap: .6rem; }
.cms-message[b-r3k1js7yeq] { padding: .8rem 1rem; color: #eed4a0; border: 1px solid #80602c; background: #16130c; }
@media (max-width: 760px) { .frontpage-cms[b-r3k1js7yeq] { padding: 1rem; } .settings-grid[b-r3k1js7yeq], .focal-grid[b-r3k1js7yeq] { grid-template-columns: 1fr; } .announcements-editor > header[b-r3k1js7yeq] { align-items: flex-start; flex-direction: column; } }
/* /Components/Pages/DebugToverkat.razor.rz.scp.css */
/* Development-only debug page for the toverkat encounter */

.debug-note[b-g7yi185161] {
    color: #cfc4dd;
    font-size: 14px;
    max-width: 60ch;
}

.debug-grid[b-g7yi185161] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: start;
}

@media (max-width: 900px) {
    .debug-grid[b-g7yi185161] { grid-template-columns: 1fr; }
}

.debug-panel[b-g7yi185161] {
    background: rgba(12, 8, 20, 0.92);
    border: 1px solid #2c2340;
    border-radius: 12px;
    padding: 16px;
}

.debug-panel h2[b-g7yi185161] {
    font-size: 16px;
    margin: 18px 0 8px;
    color: #ffb43c;
}

.debug-panel h2:first-child[b-g7yi185161] { margin-top: 0; }

/* Keep the raw-source diagnostic in its panel so it cannot compete with the
   viewport-positioned encounter under test. */
#magic-cat-debug-video[b-g7yi185161] {
    position: static;
    width: 100%;
    max-width: 500px;
    height: auto;
    opacity: 1;
    display: block;
    visibility: visible;
    background: transparent;
}

.btn-row[b-g7yi185161] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0;
}

.btn-row button[b-g7yi185161],
.test-btn[b-g7yi185161] {
    padding: 8px 14px;
    border: 1px solid #554a75;
    border-radius: 8px;
    background: #1c1530;
    color: #e8e2f5;
    cursor: pointer;
    font: 600 13px/1 var(--font-ui, "Source Sans 3", sans-serif);
}

.btn-row button:hover[b-g7yi185161],
.test-btn:hover[b-g7yi185161] {
    background: #2a2147;
}

.test-btn[b-g7yi185161] {
    border-color: #ffb43c;
    color: #ffb43c;
    font-size: 15px;
    padding: 10px 18px;
    margin: 8px 0;
}

.stats[b-g7yi185161] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 4px 16px;
    margin: 12px 0;
    font-size: 13px;
}

.stats dt[b-g7yi185161] { color: #9a8db5; white-space: nowrap; }
.stats dd[b-g7yi185161] { margin: 0; color: #e8e2f5; word-break: break-all; }

.stats dd.state[b-g7yi185161] {
    color: #ffb43c;
    font-weight: 700;
}

label[b-g7yi185161] {
    display: block;
    margin: 6px 0;
    color: #cfc4dd;
    font-size: 14px;
}

label.slider[b-g7yi185161] {
    display: grid;
    grid-template-columns: 180px 1fr 48px;
    align-items: center;
    gap: 12px;
}

label.slider span[b-g7yi185161] {
    color: #ffb43c;
    font-weight: 700;
    text-align: right;
}

.log[b-g7yi185161] {
    list-style: none;
    padding: 0;
    margin: 8px 0;
    max-height: 320px;
    overflow: auto;
    font: 12px/1.6 ui-monospace, Consolas, monospace;
    color: #b7acc9;
}

.log time[b-g7yi185161] { color: #6f6289; margin-right: 8px; }
/* /Components/Pages/MijnHalloween.razor.rz.scp.css */
.app-pairing[b-4zi9y3hshb] {
    display: grid;
    grid-template-columns: minmax(16rem, 1fr) auto minmax(18rem, 1fr);
    gap: 1.5rem;
    align-items: start;
    margin-block: 1.5rem;
}

.pairing-code[b-4zi9y3hshb] {
    display: grid;
    justify-items: center;
    gap: .45rem;
}

.pairing-qr[b-4zi9y3hshb] {
    width: min(15rem, 70vw);
    padding: .6rem;
    background: #fff;
    border-radius: .75rem;
}

.pairing-qr[b-4zi9y3hshb]  svg { display: block; width: 100%; height: auto; }
.pairing-code > strong[b-4zi9y3hshb] { font-size: 1.4rem; letter-spacing: .14em; }
.paired-devices[b-4zi9y3hshb] { display: grid; gap: .75rem; }

.device-row[b-4zi9y3hshb] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-block: .75rem;
    border-bottom: 1px solid rgb(255 255 255 / 16%);
}

.device-row div[b-4zi9y3hshb] { display: grid; gap: .15rem; }
.device-row small[b-4zi9y3hshb] { opacity: .76; }

@media (max-width: 900px) {
    .app-pairing[b-4zi9y3hshb] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Monsterboek.razor.rz.scp.css */
.mb-world[b-53bc6sm68e] {
    --mb-gold: #c89245;
    --mb-ink: #24170f;
    --mb-turn-duration: 640ms;
    position: relative;
    min-height: 100vh;
    color: #f1e4cb;
    background: var(--mb-backdrop) center / cover fixed no-repeat;
    isolation: isolate;
}


.mb-library[b-53bc6sm68e] {
    width: min(1220px, calc(100% - 40px));
    margin: 0 auto;
    padding: clamp(110px, 12vw, 155px) 0 80px;
}

.mb-library-heading[b-53bc6sm68e] {
    max-width: 780px;
    margin: 0 auto 32px;
    text-align: center;
    text-shadow: 0 3px 18px #000;
}

.mb-library-heading span[b-53bc6sm68e],
.mb-library-filters label > span[b-53bc6sm68e] {
    color: #d8a85e;
    font: 700 .7rem/1.2 Cinzel, Georgia, serif;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.mb-library-heading h1[b-53bc6sm68e] {
    margin: .35rem 0;
    color: #f0d39d;
    font: 600 clamp(2.6rem, 6vw, 5.4rem)/1 Cinzel, Georgia, serif;
    letter-spacing: .035em;
}

.mb-library-heading p[b-53bc6sm68e] {
    margin: 1rem 0 0;
    color: #ded5c5;
    font: 1.05rem/1.6 Georgia, serif;
}

.mb-library-filters[b-53bc6sm68e] {
    display: grid;
    grid-template-columns: minmax(220px, 1.7fr) repeat(3, minmax(150px, 1fr));
    gap: 1px;
    margin: 0 auto 30px;
    padding: 1px;
    border: 1px solid #75542f;
    background: #6d4e2f;
    box-shadow: 0 18px 55px #0009;
}

.mb-library-filters label[b-53bc6sm68e] {
    display: grid;
    gap: 7px;
    padding: 12px 14px;
    background: rgba(13, 12, 11, .92);
}

.mb-library-filters input[b-53bc6sm68e],
.mb-library-filters select[b-53bc6sm68e] {
    min-width: 0;
    width: 100%;
    border: 0;
    outline: 0;
    color: #f1e6d2;
    background: transparent;
    font: .95rem Georgia, serif;
}

.mb-library-filters label:focus-within[b-53bc6sm68e] {
    box-shadow: inset 0 -2px #cf9140;
}

.mb-story-shelf[b-53bc6sm68e] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(285px, 1fr));
    gap: 22px;
}

.mb-story-card[b-53bc6sm68e] {
    display: grid;
    grid-template-columns: 112px 1fr;
    min-height: 245px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #7a5831;
    color: #eadfc9;
    background: linear-gradient(110deg, rgba(20, 15, 11, .97), rgba(8, 9, 9, .94));
    box-shadow: 0 18px 45px #000b, inset 0 0 32px #9f5d1710;
    text-align: left;
    cursor: pointer;
    transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.mb-story-card:hover[b-53bc6sm68e],
.mb-story-card:focus-visible[b-53bc6sm68e] {
    transform: translateY(-5px);
    border-color: #d0994f;
    box-shadow: 0 24px 55px #000d, 0 0 22px #bd74222a;
    outline: none;
}

.mb-story-cover[b-53bc6sm68e] {
    position: relative;
    overflow: hidden;
    background: #120c08;
    box-shadow: 8px 0 18px #0009;
}

.mb-story-cover[b-53bc6sm68e]::after {
    content: "";
    position: absolute;
    inset: 0 0 0 auto;
    width: 8px;
    background: linear-gradient(90deg, transparent, #000b);
}

.mb-story-cover img[b-53bc6sm68e] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mb-story-copy[b-53bc6sm68e] {
    display: flex;
    flex-direction: column;
    padding: 22px 20px;
}

.mb-story-copy small[b-53bc6sm68e],
.mb-story-copy b[b-53bc6sm68e] {
    color: #bd8a49;
    font: 700 .67rem/1.35 Cinzel, Georgia, serif;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.mb-story-copy strong[b-53bc6sm68e] {
    margin-top: 9px;
    color: #f0d3a0;
    font: 600 1.35rem/1.2 Cinzel, Georgia, serif;
}

.mb-story-copy em[b-53bc6sm68e] {
    margin-top: 3px;
    color: #c6b49a;
    font: italic .88rem Georgia, serif;
}

.mb-story-copy > span[b-53bc6sm68e] {
    display: -webkit-box;
    margin: 15px 0;
    overflow: hidden;
    color: #cfc4b2;
    font: .9rem/1.55 Georgia, serif;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.mb-story-copy b[b-53bc6sm68e] { margin-top: auto; }

.mb-library-loading[b-53bc6sm68e],
.mb-error-card[b-53bc6sm68e],
.mb-no-results[b-53bc6sm68e] {
    width: min(560px, 100%);
    margin: 55px auto;
    padding: 28px;
    border: 1px solid #76552f;
    background: #0d0d0cd9;
    text-align: center;
}

.mb-library-loading img[b-53bc6sm68e] {
    display: block;
    width: 95px;
    margin: 0 auto 18px;
    filter: drop-shadow(0 10px 18px #000);
    animation: mb-breathe-b-53bc6sm68e 1.8s ease-in-out infinite;
}

.mb-error-card button[b-53bc6sm68e],
.mb-reader-error button[b-53bc6sm68e] {
    padding: .7rem 1rem;
    border: 1px solid #9a6a31;
    color: #f1dfc0;
    background: #28190e;
    cursor: pointer;
}

.mb-reading-world[b-53bc6sm68e] {
    position: fixed;
    z-index: 2000;
    inset: 0;
    min-height: 0;
    overflow: hidden;
    background:
        radial-gradient(ellipse at 50% 48%, transparent 34%, rgba(2, 3, 4, .18) 76%, rgba(1, 2, 3, .54) 100%),
        linear-gradient(180deg, rgba(3, 5, 7, .08), rgba(3, 3, 3, .16)),
        var(--mb-backdrop) center / cover fixed no-repeat;
}

.mb-back[b-53bc6sm68e] {
    position: fixed;
    z-index: 40;
    top: max(16px, env(safe-area-inset-top));
    left: max(18px, env(safe-area-inset-left));
    min-width: 154px;
    min-height: 48px;
    padding: 10px 18px;
    border: 1px solid #a97a3ec2;
    border-radius: 3px;
    color: #e0c591;
    background: linear-gradient(180deg, rgba(21, 16, 12, .94), rgba(8, 9, 9, .91));
    box-shadow: inset 0 0 0 1px #e7b96c13, 0 10px 28px #0008;
    font: 700 .76rem Cinzel, Georgia, serif;
    letter-spacing: .065em;
    text-transform: uppercase;
    cursor: pointer;
    backdrop-filter: blur(5px);
}

.mb-back span[b-53bc6sm68e] { display: inline-block; margin-right: 10px; color: #e1ac5e; font-size: 1.35rem; line-height: .5; vertical-align: -2px; }
.mb-back:hover[b-53bc6sm68e], .mb-back:focus-visible[b-53bc6sm68e] { color: #fff0d2; border-color: #d29b52; outline: none; }
.mb-back:disabled[b-53bc6sm68e] { opacity: .55; cursor: default; }

.mb-reader-space[b-53bc6sm68e] {
    display: grid;
    grid-template-rows: minmax(0, 1fr) 44px;
    width: 100%;
    height: 100dvh;
    padding: 68px 3vw 14px;
}

/*
    Het leesvenster. Eén pagina is een halve bladbreedte; op een smal scherm
    toont het venster één pagina en verschuift het boek zodat de juiste helft
    voor het oog staat.
*/
.mb-reader-stage[b-53bc6sm68e] {
    /* De referentie gebruikt brede, historische foliopagina's in plaats van
       de smalle 2:3-kaarten uit de oude reader. */
    --mb-page-width: min(46vw, calc((100dvh - 128px) * .7462687));
    --mb-page-height: calc(var(--mb-page-width) * 1.34);
    --mb-book-width: calc(var(--mb-page-width) * 2);
    --mb-sheet-left: 50%;
    position: relative;
    display: grid;
    place-items: center;
    min-height: 0;
    overflow: hidden;
    touch-action: pan-y;
    outline: none;
}

/* Voor het openen is er geen spread. Cover, pagina's en achterkaft delen één
   geometrische stapel met exact de breedte van één kaft. Tijdens Opening
   blijft die waarheid gelden; de draaiende frontcover creëert zelf de ruimte
   links. */
.is-loading .mb-reader-stage[b-53bc6sm68e],
.is-closed .mb-reader-stage[b-53bc6sm68e],
.is-opening .mb-reader-stage[b-53bc6sm68e] {
    --mb-book-width: var(--mb-page-width);
    --mb-sheet-left: 0%;
}

/* Verborgen meetblad waarmee de paginering de echte pagina-afmetingen meet. */
.mb-measure[b-53bc6sm68e] {
    position: absolute;
    top: 0;
    left: -200vw;
    width: var(--mb-page-width);
    height: var(--mb-page-height);
    visibility: hidden;
    pointer-events: none;
    contain: strict;
}

.mb-physical-book[b-53bc6sm68e] {
    position: relative;
    display: grid;
    place-items: center;
    width: var(--mb-book-width);
    height: var(--mb-page-height);
    transition: none;
}

.is-loading .mb-physical-book[b-53bc6sm68e],
.is-closed .mb-physical-book[b-53bc6sm68e] { transform: scale(.92); }
.is-opening .mb-physical-book[b-53bc6sm68e] {
    transform: translateX(50%) scale(1);
    transition: transform 900ms cubic-bezier(.22, .72, .16, 1);
}
.is-closing .mb-physical-book[b-53bc6sm68e] { transform: translateX(-25%) scale(.92); transition-duration: 680ms; }
.is-closing .mb-physical-book[b-53bc6sm68e],
.is-turningforward .mb-physical-book[b-53bc6sm68e],
.is-turningbackward .mb-physical-book[b-53bc6sm68e] {
    transition-property: transform;
    transition-timing-function: cubic-bezier(.22, .72, .16, 1);
}

/* Het boek ligt op zijn achterkant: spiegelbeeldig aan de dichtgeslagen
   voorkant schuift de linkerhelft (met de achterkaft erop) naar het midden. */
.mb-physical-book.is-back-cover[b-53bc6sm68e] { transform: translateX(25%) scale(.92); }

/* De lezer verschuift het boek, niet het papier. */
.mb-book-track[b-53bc6sm68e] {
    width: 100%;
    height: 100%;
    /* Percentage is relatief aan de volledige spreadbreedte: 25% daarvan is
    exact een halve pagina. Dit blijft ook in mobiele browsers betrouwbaar. */
    transform: translateX(var(--mb-pan-shift, 0%));
    transition: none;
}

/* Alleen een echte bladslag beweegt de mobiele camerapan mee. Bij de overgang
   Opening -> Open wisselt de container van éénstapel- naar spreadgeometrie;
   de equivalente eindpositie moet daar in hetzelfde frame vaststaan. */
.is-turningforward .mb-book-track[b-53bc6sm68e],
.is-turningbackward .mb-book-track[b-53bc6sm68e] {
    transition: transform var(--mb-turn-duration, 640ms) cubic-bezier(.35, .05, .18, 1);
}

/*
    Het blok is de directe ouder van de bladen: hier staat de perspective.
    Elk vel krijgt zo zijn eigen 3D-projectie terwijl de stapelorde via
    z-index bepaald blijft (geen depth-sorting-verrassingen).
    Hier bewust GEEN filter/overflow: zulke groeps-eigenschappen klappen de
    3D-context plat en lieten voorheen de voorkant van een omslaand blad
    door de achterkant heen als gespiegelde tekst zien.
*/
.mb-book-block[b-53bc6sm68e] {
    position: relative;
    width: 100%;
    height: var(--mb-page-height);
    perspective: 2600px;
    perspective-origin: 50% 46%;
}

.mb-book-shadow[b-53bc6sm68e] {
    position: absolute;
    z-index: 0;
    inset: 9% 3% -4%;
    border-radius: 50%;
    background: #000;
    filter: blur(28px);
    opacity: .74;
}

/* De zichtbare dikte van het boek zit in elk vel zelf (.mb-sheet-edge):
   die rand staat vast aan het papier en draait mee met dezelfde
   perspectief- en schaaltransformatie. Er zweven dus geen losse
   paginastroken naast het boek. */

/* De rug: één doorlopende schaduwband over het midden van het boek. */
.mb-book-spine[b-53bc6sm68e] {
    position: absolute;
    z-index: 2;
    top: 1.4%;
    bottom: 1.4%;
    left: 50%;
    width: 3.9%;
    transform: translateX(-50%);
    pointer-events: none;
    background: linear-gradient(90deg, transparent, #29170a78 31%, #110906d1 49%, #6a472549 66%, transparent);
    mix-blend-mode: multiply;
}

.mb-riffle[b-53bc6sm68e] {
    position: absolute;
    z-index: 22;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

.mb-riffle i[b-53bc6sm68e] {
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    border-radius: 0 10px 10px 0;
    background: url('/assets/monsterboek/antique-page-texture.png') center / cover;
    box-shadow: -14px 0 22px #3a1b09aa;
    transform-origin: left;
    animation: mb-riffle-page-b-53bc6sm68e 620ms ease-in-out both;
}

.mb-riffle i:nth-child(2)[b-53bc6sm68e] { animation-delay: 70ms; }
.mb-riffle i:nth-child(3)[b-53bc6sm68e] { animation-delay: 140ms; }
.mb-riffle i:nth-child(4)[b-53bc6sm68e] { animation-delay: 210ms; }
.mb-riffle i:nth-child(5)[b-53bc6sm68e] { animation-delay: 280ms; }

/* Grote, transparante hitbox boven de fysieke papierhoek. De zichtbare curl
   zelf leeft in MonsterBookSheet en draait daardoor met het papier mee. */
.mb-page-curl[b-53bc6sm68e] {
    position: absolute;
    z-index: 30;
    bottom: calc(50% - (var(--mb-page-height) / 2));
    width: clamp(68px, 7.2vw, 96px);
    height: clamp(68px, 7.2vw, 96px);
    padding: 0;
    border: 0;
    background: transparent;
    appearance: none;
    cursor: grab;
    touch-action: none;
    -webkit-touch-callout: none;
}

.mb-page-curl.is-left[b-53bc6sm68e] { left: calc(50% - var(--mb-page-width)); }
.mb-page-curl.is-right[b-53bc6sm68e] { right: calc(50% - var(--mb-page-width)); }
.mb-page-curl:hover[b-53bc6sm68e], .mb-page-curl:focus-visible[b-53bc6sm68e] { outline: none; }
.mb-page-curl:focus-visible[b-53bc6sm68e]::after {
    content: "";
    position: absolute;
    right: 8px;
    bottom: 8px;
    width: 30px;
    height: 30px;
    border: 1px solid #d7a75b;
    border-radius: 70% 0 0;
    box-shadow: 0 0 0 2px #1a1008b8;
}
.mb-page-curl.is-left:focus-visible[b-53bc6sm68e]::after { right: auto; left: 8px; transform: scaleX(-1); }
.book-is-dragging .mb-page-curl[b-53bc6sm68e] { cursor: grabbing; }
.mb-page-curl:disabled[b-53bc6sm68e] { cursor: default; }

/* De Blazor-status dekt ook keyboard- en paginator-omslagen; de tijdelijke
   documentclass dekt pointerdrag en de aansluitende snap/complete-beweging. */
.is-turningforward .mb-reader-stage[b-53bc6sm68e],
.is-turningforward .mb-reader-stage *[b-53bc6sm68e],
.is-turningbackward .mb-reader-stage[b-53bc6sm68e],
.is-turningbackward .mb-reader-stage *[b-53bc6sm68e] {
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.mb-page-nav[b-53bc6sm68e] {
    z-index: 32;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    align-self: end;
    min-height: 40px;
    color: #dbc293;
    font: 700 .72rem Cinzel, Georgia, serif;
    letter-spacing: .09em;
    text-shadow: 0 2px 7px #000;
    text-transform: uppercase;
}

.mb-page-nav input[b-53bc6sm68e] {
    width: 28px;
    padding: 4px 0 3px;
    border: 0;
    border-radius: 0;
    color: #f2d8a6;
    background: transparent;
    font: 700 .88rem Cinzel, Georgia, serif;
    text-align: center;
    outline: none;
    appearance: textfield;
}

.mb-page-nav input[b-53bc6sm68e]::-webkit-inner-spin-button { appearance: none; }
.mb-page-nav input:focus[b-53bc6sm68e] { outline: 1px solid #a87c43; outline-offset: 3px; }
.mb-page-nav output[b-53bc6sm68e],
.mb-page-nav__divider[b-53bc6sm68e] { color: #ead2a5; font-size: .82rem; }

.mb-page-nav__ornament[b-53bc6sm68e] {
    position: relative;
    width: 43px;
    height: 1px;
    margin-inline: 2px;
    background: linear-gradient(90deg, transparent, #c89445 28%, #e3bd73 78%, transparent);
}

.mb-page-nav__ornament[b-53bc6sm68e]::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 7px;
    width: 7px;
    height: 7px;
    border: 1px solid #d2a45d;
    transform: translateY(-50%) rotate(45deg);
}

.mb-page-nav__ornament.is-right[b-53bc6sm68e] { transform: scaleX(-1); }
.mb-page-error[b-53bc6sm68e] { position: absolute; margin-top: -54px; padding: 5px 8px; color: #f0cf9e; background: #160d08e8; box-shadow: 0 3px 10px #000; }

.mb-reader-status[b-53bc6sm68e] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

.mb-preparing[b-53bc6sm68e] {
    position: absolute;
    z-index: 25;
    bottom: 5%;
    left: 50%;
    transform: translateX(-50%);
    color: #d4b47f;
    font: .72rem Cinzel, Georgia, serif;
    letter-spacing: .1em;
    text-shadow: 0 2px 8px #000;
}

.mb-reader-error[b-53bc6sm68e] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: min(520px, calc(100% - 40px));
    padding: 34px;
    transform: translate(-50%, -50%);
    border: 1px solid #835e35;
    background: #0c0c0bea;
    text-align: center;
    box-shadow: 0 30px 80px #000;
}

@keyframes mb-riffle-page-b-53bc6sm68e {
    0% { transform: rotateY(0); }
    100% { transform: rotateY(-178deg); }
}

@keyframes mb-breathe-b-53bc6sm68e { 50% { transform: translateY(-4px); filter: drop-shadow(0 15px 24px #000) brightness(1.08); } }

@media (max-width: 900px) {
    .mb-library-filters[b-53bc6sm68e] { grid-template-columns: 1fr 1fr; }
    .mb-filter-search[b-53bc6sm68e] { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
    .mb-library[b-53bc6sm68e] { width: min(100% - 24px, 520px); padding-top: 92px; }
    .mb-library-filters[b-53bc6sm68e] { grid-template-columns: 1fr; }
    .mb-filter-search[b-53bc6sm68e] { grid-column: auto; }
    .mb-story-shelf[b-53bc6sm68e] { grid-template-columns: 1fr; }
    .mb-story-card[b-53bc6sm68e] { grid-template-columns: 92px 1fr; min-height: 215px; }
    .mb-story-copy[b-53bc6sm68e] { padding: 17px 15px; }

    .mb-reader-space[b-53bc6sm68e] { grid-template-rows: minmax(0, 1fr) 42px; padding: 60px 0 8px; }
    .mb-reader-stage[b-53bc6sm68e] { --mb-page-width: min(92vw, calc((100dvh - 118px) * .7462687)); }
    .is-loading .mb-physical-book[b-53bc6sm68e],
    .is-closed .mb-physical-book[b-53bc6sm68e],
    .is-opening .mb-physical-book[b-53bc6sm68e],
    .is-closing .mb-physical-book[b-53bc6sm68e] { transform: translate(-50%, -50%); }
    /* Op mobiel centreert de lezer het boek met de pan; de kaft krimpt niet. */
    .mb-physical-book[b-53bc6sm68e],
    .mb-physical-book.is-back-cover[b-53bc6sm68e] {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .mb-page-curl[b-53bc6sm68e] {
        bottom: calc(50% - (var(--mb-page-height) / 2));
        width: clamp(70px, 22vw, 90px);
        height: clamp(70px, 22vw, 90px);
    }
    .mb-page-curl.is-left[b-53bc6sm68e] { left: calc(50% - (var(--mb-page-width) / 2)); }
    .mb-page-curl.is-right[b-53bc6sm68e] { right: calc(50% - (var(--mb-page-width) / 2)); }
    .mb-back[b-53bc6sm68e] { min-width: 0; min-height: 42px; padding: 8px 12px; font-size: .66rem; }
    .mb-page-nav[b-53bc6sm68e] { gap: 7px; }
    .mb-page-nav__ornament[b-53bc6sm68e] { width: 28px; }
}

@media (prefers-reduced-motion: reduce) {
    .mb-world[b-53bc6sm68e] { --mb-turn-duration: 100ms; }
    .mb-physical-book[b-53bc6sm68e] { transition-duration: 80ms !important; }
    .mb-book-track[b-53bc6sm68e] { transition-duration: 100ms !important; }
    .mb-riffle i[b-53bc6sm68e] { animation-duration: 100ms !important; }
    .mb-library-loading img[b-53bc6sm68e] { animation: none; }
    .mb-page-curl[b-53bc6sm68e] { transition: none; }
}
/* /Components/Pages/Nachtbode.razor.rz.scp.css */
.nachtbode-page[b-9qivt5y8y5] { --gold:#c8923c; --paper:#d2b987; --ink:#1d1710; min-height:100vh; padding-bottom:5rem; overflow:hidden; color:#e9dcc1; background:#040809 radial-gradient(circle at 9% 70%,rgba(74,34,91,.18),transparent 28%),radial-gradient(circle at 92% 74%,rgba(50,28,70,.2),transparent 25%); }
.nachtbode-page[b-9qivt5y8y5]::before { position:fixed; z-index:0; inset:0; pointer-events:none; opacity:.13; content:""; background:linear-gradient(90deg,transparent 49.5%,rgba(201,146,60,.18) 50%,transparent 50.5%),repeating-linear-gradient(110deg,rgba(255,255,255,.025) 0 1px,transparent 1px 8px); }
.nachtbode-loading[b-9qivt5y8y5],.nachtbode-error[b-9qivt5y8y5] { min-height:70vh; display:grid; place-content:center; text-align:center; font-family:"Cinzel",serif; }
.nachtbode-loading span[b-9qivt5y8y5] { font-size:clamp(2rem,8vw,6rem); color:var(--gold); }
.nachtbode-hero[b-9qivt5y8y5] { position:relative; z-index:1; min-height:clamp(320px,31vw,400px); isolation:isolate; background:#071011; }
.nachtbode-hero[b-9qivt5y8y5]::before { position:absolute; z-index:-2; inset:0; content:""; background-image:var(--hero-image); background-size:cover; background-position:var(--focus-x,75%) var(--focus-y,50%); }
.nachtbode-hero[b-9qivt5y8y5]::after { position:absolute; z-index:-1; inset:0; content:""; background:linear-gradient(90deg,rgba(5,8,10,.96) 0%,rgba(5,8,10,.72) 40%,rgba(5,8,10,.15) 75%,rgba(5,8,10,.35) 100%); }
.hero-copy[b-9qivt5y8y5] { width:min(1180px,92vw); margin:auto; padding:clamp(3.5rem,7vw,6rem) 0 3rem; }
.hero-copy h1[b-9qivt5y8y5] { max-width:720px; margin:.4rem 0; font:700 clamp(2.2rem,4.25vw,4.6rem)/.98 "Cinzel",serif; letter-spacing:-.04em; text-shadow:0 3px 24px #000; }
.hero-copy h1 em[b-9qivt5y8y5] { color:#d18b35; font-style:normal; }
.hero-ornament[b-9qivt5y8y5] { width:max-content; color:#bf7d2e; letter-spacing:.45em; }
.hero-subtitle[b-9qivt5y8y5] { margin:1rem 0 .7rem; color:#a774a7; font:700 clamp(.72rem,1vw,.95rem) "Cinzel",serif; letter-spacing:.12em; }
.hero-intro[b-9qivt5y8y5] { max-width:560px; margin:0; color:#d8c8aa; font:1rem/1.55 "Source Serif 4",serif; text-shadow:0 2px 8px #000; }
.announcement-strip[b-9qivt5y8y5] { position:relative; z-index:3; width:min(1100px,92vw); min-height:82px; margin:-1rem auto 1rem; display:grid; grid-template-columns:auto 220px 68px 1fr auto; gap:1rem; align-items:center; padding:.75rem 1.15rem; border:1px solid #765020; background:rgba(5,10,12,.97); box-shadow:0 10px 30px rgba(0,0,0,.35); }
.announcement-seal[b-9qivt5y8y5] { display:grid; width:42px; height:42px; place-content:center; border:1px solid #9d6a2d; border-radius:50%; color:#b97bb7; }
.announcement-label[b-9qivt5y8y5] { padding-right:1rem; border-right:1px solid #61431e; }
.announcement-label small[b-9qivt5y8y5] { color:#ca8c3c; font:600 .63rem "Cinzel",serif; letter-spacing:.08em; }
.announcement-label h2[b-9qivt5y8y5] { margin:.15rem 0 0; color:#e0c697; font:1.15rem "IM Fell English",serif; }
.announcement-strip time[b-9qivt5y8y5] { display:grid; justify-items:center; color:#af7cb1; font-family:"Cinzel",serif; }
.announcement-strip time strong[b-9qivt5y8y5] { font-size:1.4rem; }.announcement-strip time span[b-9qivt5y8y5] { font-size:.65rem; }
.announcement-copy strong[b-9qivt5y8y5] { color:#e4d6bb; font:600 .9rem "Source Serif 4",serif; }.announcement-copy p[b-9qivt5y8y5] { margin:.18rem 0 0; color:#ab9c83; font:.78rem/1.3 "Source Serif 4",serif; }
.announcement-strip>a[b-9qivt5y8y5] { color:#c99545; font:600 .62rem "Cinzel",serif; text-decoration:none; white-space:nowrap; }
.newspaper-shell[b-9qivt5y8y5] { position:relative; z-index:2; width:min(1150px,94vw); margin:0 auto; padding:0 12px 18px; filter:drop-shadow(0 24px 36px rgba(0,0,0,.75)); }
.newspaper[b-9qivt5y8y5] { position:relative; color:var(--ink); background-color:var(--paper); background-image:radial-gradient(circle at 8% 12%,rgba(75,42,14,.22),transparent 18%),radial-gradient(circle at 91% 88%,rgba(61,31,8,.2),transparent 21%),repeating-linear-gradient(8deg,rgba(255,255,255,.035) 0 2px,rgba(61,36,13,.025) 2px 4px),linear-gradient(107deg,#c6aa77,#dbc497 42%,#c3a572); border:1px solid #5b3a1d; box-shadow:0 20px 60px rgba(0,0,0,.65),0 0 60px rgba(181,106,31,.1),inset 0 0 50px rgba(62,34,12,.2); }
.newspaper[b-9qivt5y8y5]::before { position:absolute; z-index:4; inset:-5px; pointer-events:none; content:""; border:8px solid transparent; border-image:linear-gradient(115deg,#38210f,#a37a42 15%,#493018 55%,#bf9660 82%,#39200e) 12; opacity:.6; clip-path:polygon(1% 2%,5% 0,13% 1%,22% 0,35% 1%,47% 0,59% 1%,72% 0,87% 1%,99% 0,98% 12%,100% 23%,99% 37%,100% 49%,99% 64%,100% 81%,98% 99%,84% 98%,72% 100%,60% 99%,46% 100%,34% 99%,19% 100%,1% 98%,2% 84%,0 69%,1% 55%,0 39%,1% 22%); }
.masthead[b-9qivt5y8y5] { display:flex; justify-content:center; align-items:center; gap:2rem; padding:1.15rem 2rem .6rem; text-align:center; border-bottom:3px double #332412; }
.masthead small[b-9qivt5y8y5] { display:block; margin-bottom:-.6rem; font:700 1.1rem "IM Fell English",serif; }.masthead h2[b-9qivt5y8y5] { margin:0; font:900 clamp(3.2rem,7vw,6.2rem)/1 "IM Fell English",serif; letter-spacing:.04em; }
.masthead-raven[b-9qivt5y8y5],.masthead-moon[b-9qivt5y8y5] { font-size:clamp(2rem,5vw,4rem); }.masthead-moon[b-9qivt5y8y5] { transform:rotate(-15deg); }
.edition-line[b-9qivt5y8y5] { display:flex; flex-wrap:wrap; justify-content:center; gap:.45rem 1rem; padding:.42rem 1rem; border-bottom:1px solid #49341d; font:700 .64rem "Source Serif 4",serif; letter-spacing:.06em; text-transform:uppercase; }
.edition-line span:not(:last-child)[b-9qivt5y8y5]::after { padding-left:1rem; content:"◆"; font-size:.45rem; }
.newspaper-grid[b-9qivt5y8y5] { display:block; padding:clamp(1rem,4vw,3.2rem); }
.editorial-row[b-9qivt5y8y5] { display:grid; grid-template-columns:repeat(24,minmax(0,1fr)); column-gap:clamp(8px,1.2vw,16px); align-items:start; position:relative; }
.editorial-row + .editorial-row[b-9qivt5y8y5] { margin-top:.7rem; padding-top:.85rem; }
.editorial-row + .editorial-row[b-9qivt5y8y5]::before { content:""; position:absolute; top:0; left:.5%; right:.8%; height:4px; opacity:.68; transform:rotate(-.08deg); background:repeating-linear-gradient(91deg,#3f2c18 0 17px,transparent 17px 20px,#3f2c18 20px 31px,transparent 31px 33px); clip-path:polygon(0 22%,14% 12%,24% 48%,35% 20%,47% 43%,58% 18%,70% 39%,82% 9%,100% 21%,100% 75%,79% 87%,55% 82%,30% 79%,4% 72%,0 60%); }
.editorial-column[b-9qivt5y8y5] { grid-column:var(--column)/span var(--span); min-width:0; position:relative; }
.editorial-column:not(:last-child)[b-9qivt5y8y5]::after { content:""; position:absolute; top:.35rem; bottom:.3rem; right:calc(clamp(8px,1.2vw,16px) / -2); width:2px; opacity:.45; background:repeating-linear-gradient(180deg,#3d2a17 0 13px,transparent 13px 15px,#3d2a17 15px 26px); transform:rotate(.07deg); }
.editorial-column.is-stack[b-9qivt5y8y5] { display:flex; flex-direction:column; gap:.35rem; }
.editorial-column.is-stack > * + *[b-9qivt5y8y5]::before { content:"✦  —  ✦"; display:block; margin:0 8% .4rem; overflow:hidden; text-align:center; font-size:.55rem; letter-spacing:.12em; white-space:nowrap; }
.article-area[b-9qivt5y8y5] { min-width:0; }
.article-area.area-leadleft[b-9qivt5y8y5] { grid-area:leadleft; }.article-area.area-leadright[b-9qivt5y8y5] { grid-area:leadright; }.article-area.area-sidebar[b-9qivt5y8y5] { grid-area:sidebar; }.article-area.area-bottomleft[b-9qivt5y8y5] { grid-area:bottomleft; }.article-area.area-bottomcenter[b-9qivt5y8y5] { grid-area:bottomcenter; }.article-area.area-bottomright[b-9qivt5y8y5] { grid-area:bottomright; }
.nachtbode-article[b-9qivt5y8y5] { min-width:0; position:relative; }
.article-link[b-9qivt5y8y5],.nachtbode-article:not(.is-clickable)[b-9qivt5y8y5] { display:block; padding:.75rem; color:inherit; text-decoration:none; }
.nachtbode-article.is-clickable[b-9qivt5y8y5] { transition:transform .18s ease,box-shadow .18s ease,filter .18s ease; }.nachtbode-article.is-clickable:hover[b-9qivt5y8y5],.nachtbode-article.is-clickable:focus-within[b-9qivt5y8y5] { z-index:2; transform:translateY(-1px); filter:contrast(1.03); box-shadow:0 0 0 1px rgba(106,67,25,.25),0 4px 12px rgba(70,40,15,.15); }
.article-link:focus-visible[b-9qivt5y8y5] { outline:3px solid #744510; outline-offset:-4px; }
.nachtbode-article[b-9qivt5y8y5]  .paper-category { margin-bottom:.3rem; font:700 .58rem "Source Serif 4",serif; letter-spacing:.1em; }.nachtbode-article[b-9qivt5y8y5]  h3 { margin:0; font:900 clamp(1.35rem,2.3vw,2.65rem)/.95 "IM Fell English",serif; text-transform:uppercase; }.nachtbode-article[b-9qivt5y8y5]  h4 { margin:.4rem 0; font:700 clamp(.73rem,1vw,.92rem)/1.15 "Source Serif 4",serif; text-transform:uppercase; }.nachtbode-article[b-9qivt5y8y5]  img { width:100%; aspect-ratio:3/2; margin:.55rem 0; object-fit:cover; filter:sepia(.2) contrast(1.05) brightness(.88); transition:transform .18s ease; }.nachtbode-article:hover[b-9qivt5y8y5]  img { transform:scale(1.012); }.nachtbode-article[b-9qivt5y8y5]  p { margin:.35rem 0; font:.79rem/1.26 "Source Serif 4",serif; }.nachtbode-article[b-9qivt5y8y5]  .read-more { display:block; margin-top:.65rem; padding-top:.35rem; border-top:1px solid #5b4020; font:700 .56rem "Source Serif 4",serif; }.nachtbode-article[b-9qivt5y8y5]  .image-fallback { display:grid; min-height:80px; place-content:center; gap:.5rem; color:#3e2b18; font-size:1.6rem; opacity:.75; }
.area-sidebar[b-9qivt5y8y5]  .image-fallback { display:none; }
.area-sidebar .nachtbode-article:not(.is-clickable)[b-9qivt5y8y5] { padding:.5rem; }
.type-shortnews[b-9qivt5y8y5]  h3,.type-warning[b-9qivt5y8y5]  h3 { font-size:1rem; }.type-shortnews[b-9qivt5y8y5]  h4,.type-warning[b-9qivt5y8y5]  h4 { font-size:.67rem; }.type-shortnews[b-9qivt5y8y5]  p,.type-warning[b-9qivt5y8y5]  p { font-size:.68rem; }.area-bottomleft[b-9qivt5y8y5],.area-bottomcenter[b-9qivt5y8y5],.area-bottomright[b-9qivt5y8y5] { min-height:135px; }.area-bottomleft[b-9qivt5y8y5]  img,.area-bottomcenter[b-9qivt5y8y5]  img,.area-bottomright[b-9qivt5y8y5]  img { float:left; width:38%; margin:.3rem .6rem .2rem 0; }
.nachtbode-ad[b-9qivt5y8y5] { padding:.65rem .55rem; text-align:center; font-family:"Source Serif 4",serif; background:radial-gradient(circle,rgba(78,48,22,.08),transparent 70%); }
.nachtbode-ad img[b-9qivt5y8y5] { display:block; width:min(100%,170px); max-height:145px; margin:.25rem auto; object-fit:contain; filter:grayscale(1) sepia(.35) contrast(1.25); mix-blend-mode:multiply; }
.nachtbode-ad h3[b-9qivt5y8y5] { margin:.2rem 0; font:900 clamp(1rem,1.7vw,1.65rem)/.94 "IM Fell English",serif; }.nachtbode-ad h4[b-9qivt5y8y5] { margin:.25rem 0; font-size:.7rem; text-transform:uppercase; }.nachtbode-ad p[b-9qivt5y8y5] { margin:.3rem 0; font-size:.72rem; line-height:1.25; }.nachtbode-ad strong[b-9qivt5y8y5] { display:block; margin:.35rem 0; font-size:.65rem; }.nachtbode-ad small[b-9qivt5y8y5] { display:block; font-size:.52rem; line-height:1.2; font-style:italic; }
.ad-label[b-9qivt5y8y5] { font-size:.48rem; letter-spacing:.28em; }.ad-victorianbox[b-9qivt5y8y5],.ad-illustrated[b-9qivt5y8y5] { outline:3px double rgba(58,39,20,.75); outline-offset:-4px; }.ad-coupon[b-9qivt5y8y5] { border-block:2px dashed rgba(58,39,20,.65); }.ad-wantedstyle h3[b-9qivt5y8y5] { font-size:clamp(1.2rem,2vw,2rem); }.decorative-filler[b-9qivt5y8y5] { display:flex; justify-content:center; gap:.7rem; padding:1rem; }
.all-announcements[b-9qivt5y8y5] { width:min(1100px,92vw); margin:1rem auto; }.all-announcements article[b-9qivt5y8y5] { display:flex; gap:1rem; padding:1rem; border:1px solid #59401f; background:#071011; }.all-announcements h2[b-9qivt5y8y5] { margin:0; color:#d8c19a;font:1rem "Cinzel",serif; }.all-announcements p[b-9qivt5y8y5]{margin:.2rem 0;color:#aa9a80;}
.article-overlay[b-9qivt5y8y5] { position:fixed; z-index:1000; inset:0; display:grid; place-items:center; padding:4vh 2vw; background:rgba(2,5,7,.76); backdrop-filter:blur(4px); animation:overlay-in-b-9qivt5y8y5 .18s ease both; }
.article-dialog[b-9qivt5y8y5] { width:min(1000px,88vw); max-height:90vh; overflow:auto; padding:1.3rem 2.4rem 1.5rem; animation:dialog-in-b-9qivt5y8y5 .24s ease both; outline:none; }.modal-close[b-9qivt5y8y5] { position:sticky; z-index:10; top:0; float:right; width:44px;height:44px;margin:-.8rem -1.8rem 0 0;border:1px solid #b77627;border-radius:50%;color:#e8b45d;background:#071014;font-size:1.8rem;line-height:1;box-shadow:0 0 18px rgba(183,118,39,.25);}.modal-close:hover[b-9qivt5y8y5],.modal-close:focus-visible[b-9qivt5y8y5]{border-color:#e2a64c;box-shadow:0 0 24px rgba(224,154,57,.5);}
.modal-masthead[b-9qivt5y8y5] { padding:.2rem 3rem .65rem; }.modal-masthead h2[b-9qivt5y8y5] { font-size:clamp(2.7rem,7vw,5.2rem); }.modal-masthead p[b-9qivt5y8y5]{margin:0;font:700 .8rem "Cinzel",serif;letter-spacing:.2em;}.article-heading[b-9qivt5y8y5]{text-align:center;padding:1rem 0}.article-heading h1[b-9qivt5y8y5]{margin:0;font:900 clamp(2.2rem,5vw,4rem)/.96 "IM Fell English",serif;text-transform:uppercase}.article-heading>p[b-9qivt5y8y5]{margin:.6rem 0;font:700 clamp(.95rem,1.7vw,1.3rem) "Source Serif 4",serif;text-transform:uppercase}.article-meta[b-9qivt5y8y5]{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 1.4rem;margin-top:.8rem;font:700 .67rem "Source Serif 4",serif;letter-spacing:.05em}.article-visual-grid[b-9qivt5y8y5]{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(210px,.8fr);gap:1rem}.article-visual-grid>img[b-9qivt5y8y5]{width:100%;height:100%;max-height:430px;object-fit:cover;border:1px solid #4d341b;filter:sepia(.22) contrast(1.06) brightness(.9)}.article-visual-grid aside[b-9qivt5y8y5]{display:grid;gap:.8rem}.article-visual-grid blockquote[b-9qivt5y8y5]{position:relative;margin:0;padding:1.2rem;border:2px double #44301b;text-align:center}.article-visual-grid blockquote>span[b-9qivt5y8y5]{position:absolute;top:-.25rem;left:.7rem;font-size:3.8rem}.article-visual-grid blockquote p[b-9qivt5y8y5]{margin:1.2rem 0 .7rem;font:italic 1.35rem/1.15 "IM Fell English",serif}.article-visual-grid cite[b-9qivt5y8y5]{font:700 .65rem "Source Serif 4",serif;text-transform:uppercase}.sidebar-notes[b-9qivt5y8y5]{border:1px solid #4c351d;padding:.65rem}.sidebar-notes>h2[b-9qivt5y8y5]{margin:0 0 .4rem;padding-bottom:.35rem;border-bottom:1px solid #5c4020;text-align:center;font:900 .8rem "Source Serif 4",serif}.sidebar-notes article[b-9qivt5y8y5]{display:flex;gap:.6rem;padding:.45rem 0;border-bottom:1px dotted #6a4a28}.sidebar-notes h3[b-9qivt5y8y5],.sidebar-notes p[b-9qivt5y8y5]{margin:0}.sidebar-notes h3[b-9qivt5y8y5]{font:700 .68rem "Source Serif 4",serif;text-transform:uppercase}.sidebar-notes p[b-9qivt5y8y5]{font:.64rem/1.25 "Source Serif 4",serif}.article-body[b-9qivt5y8y5]{padding:1.1rem 0;font:1rem/1.48 "Source Serif 4",serif}.article-body--columns[b-9qivt5y8y5]{column-count:2;column-gap:2rem;column-rule:1px solid rgba(63,41,21,.35)}.article-body p[b-9qivt5y8y5]{margin:0 0 .85rem}.article-body p:first-of-type[b-9qivt5y8y5]::first-letter{float:left;margin:.05em .1em 0 0;font:900 4.3rem/.72 "IM Fell English",serif}.article-body h2[b-9qivt5y8y5],.article-body blockquote[b-9qivt5y8y5]{break-inside:avoid}.article-footer[b-9qivt5y8y5]{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;border-top:2px double #51371c;border-bottom:1px solid #51371c;font:700 .75rem "Source Serif 4",serif;letter-spacing:.04em}.article-loading[b-9qivt5y8y5]{display:grid;min-height:50vh;place-content:center;text-align:center;font:1.2rem "Cinzel",serif}
@keyframes overlay-in-b-9qivt5y8y5{from{opacity:0}to{opacity:1}}@keyframes dialog-in-b-9qivt5y8y5{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:850px){.announcement-strip[b-9qivt5y8y5]{grid-template-columns:auto 1fr auto}.announcement-copy[b-9qivt5y8y5]{grid-column:2/4}.announcement-strip>a[b-9qivt5y8y5]{display:none}.newspaper-grid[b-9qivt5y8y5]{grid-template-columns:1.3fr 1fr;grid-template-areas:"leadleft leadright" "sidebar sidebar" "bottomleft bottomleft" "bottomcenter bottomright"}.article-area.area-sidebar[b-9qivt5y8y5]{display:grid;grid-template-columns:repeat(4,1fr)}.article-visual-grid[b-9qivt5y8y5]{grid-template-columns:1fr}.article-visual-grid aside[b-9qivt5y8y5]{grid-template-columns:1fr 1fr}.article-dialog[b-9qivt5y8y5]{padding:1rem 1.4rem}.modal-close[b-9qivt5y8y5]{margin:-.55rem -.9rem 0 0}}
@media(max-width:560px){.nachtbode-hero[b-9qivt5y8y5]{min-height:360px}.nachtbode-hero[b-9qivt5y8y5]::after{background:linear-gradient(90deg,rgba(5,8,10,.94),rgba(5,8,10,.55))}.hero-copy[b-9qivt5y8y5]{padding-top:4.5rem}.announcement-strip[b-9qivt5y8y5]{width:calc(100% - 20px);grid-template-columns:auto 1fr;margin:-.6rem auto .8rem}.announcement-label[b-9qivt5y8y5]{border:0}.announcement-strip time[b-9qivt5y8y5]{grid-row:2}.announcement-copy[b-9qivt5y8y5]{grid-column:2}.newspaper-shell[b-9qivt5y8y5]{width:calc(100% - 12px);padding:0}.masthead[b-9qivt5y8y5]{gap:.8rem;padding:1rem .5rem}.masthead h2[b-9qivt5y8y5]{font-size:clamp(2.5rem,15vw,4rem)}.edition-line[b-9qivt5y8y5]{gap:.25rem .5rem;font-size:.52rem}.edition-line span:not(:last-child)[b-9qivt5y8y5]::after{padding-left:.5rem}.newspaper-grid[b-9qivt5y8y5]{display:flex;flex-direction:column;padding:.55rem}.area-leadleft[b-9qivt5y8y5]{order:1}.area-leadright[b-9qivt5y8y5]{order:2}.article-area.area-sidebar[b-9qivt5y8y5]{display:block;order:3}.area-bottomleft[b-9qivt5y8y5]{order:5}.area-bottomcenter[b-9qivt5y8y5]{order:6}.area-bottomright[b-9qivt5y8y5]{order:7}.nachtbode-article[b-9qivt5y8y5]{border-right:0}.area-bottomleft[b-9qivt5y8y5]  img,.area-bottomcenter[b-9qivt5y8y5]  img,.area-bottomright[b-9qivt5y8y5]  img{float:none;width:100%}.type-shortnews[b-9qivt5y8y5]  h3,.type-warning[b-9qivt5y8y5]  h3{font-size:1.3rem}.article-overlay[b-9qivt5y8y5]{padding:10px}.article-dialog[b-9qivt5y8y5]{width:calc(100vw - 20px);max-height:calc(100vh - 20px);padding:.7rem}.modal-close[b-9qivt5y8y5]{margin:0}.modal-masthead h2[b-9qivt5y8y5]{font-size:2.7rem}.article-heading h1[b-9qivt5y8y5]{font-size:2.1rem}.article-visual-grid aside[b-9qivt5y8y5]{grid-template-columns:1fr}.article-body--columns[b-9qivt5y8y5]{column-count:1}.article-footer[b-9qivt5y8y5]{font-size:.58rem;text-align:center}}
@media(prefers-reduced-motion:reduce){.nachtbode-article[b-9qivt5y8y5],.nachtbode-article[b-9qivt5y8y5]  img,.article-overlay[b-9qivt5y8y5],.article-dialog[b-9qivt5y8y5]{animation:none!important;transition:none!important}}
@media (max-width:850px) and (min-width:561px) { .newspaper-grid:has(.editorial-row)[b-9qivt5y8y5]{display:block}.editorial-row[b-9qivt5y8y5]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.editorial-column[b-9qivt5y8y5]{grid-column:auto!important}.editorial-column[style*="--span:12"][b-9qivt5y8y5],.editorial-column[style*="--span:13"][b-9qivt5y8y5],.editorial-column[style*="--span:14"][b-9qivt5y8y5],.editorial-column[style*="--span:15"][b-9qivt5y8y5],.editorial-column[style*="--span:16"][b-9qivt5y8y5],.editorial-column[style*="--span:17"][b-9qivt5y8y5],.editorial-column[style*="--span:18"][b-9qivt5y8y5],.editorial-column[style*="--span:19"][b-9qivt5y8y5],.editorial-column[style*="--span:20"][b-9qivt5y8y5],.editorial-column[style*="--span:21"][b-9qivt5y8y5],.editorial-column[style*="--span:22"][b-9qivt5y8y5],.editorial-column[style*="--span:23"][b-9qivt5y8y5],.editorial-column[style*="--span:24"][b-9qivt5y8y5]{grid-column:1/-1!important} }
@media (max-width:560px) { .newspaper-grid:has(.editorial-row)[b-9qivt5y8y5]{display:block}.editorial-row[b-9qivt5y8y5]{display:flex;flex-direction:column;gap:.45rem}.editorial-column[b-9qivt5y8y5]{width:100%}.editorial-column.is-stack .ad-classified[b-9qivt5y8y5],.editorial-column.is-stack .ad-tinyad[b-9qivt5y8y5]{width:50%;align-self:center}.editorial-column[b-9qivt5y8y5]::after{display:none} }

/* Nachtbode Hero Atmosphere Overrides */
.nachtbode-hero[b-9qivt5y8y5]::after { background:linear-gradient(94deg,rgba(4,7,10,.9) 0%,rgba(5,8,10,.6) 39%,rgba(8,13,20,.24) 70%,rgba(6,10,15,.46) 100%); }

.hero-atmosphere[b-9qivt5y8y5] {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.hero-atmosphere__lantern[b-9qivt5y8y5] {
    position: absolute;
    left: 7%;
    top: 16%;
    width: 34px;
    height: 112px;
    border: 1px solid rgba(224, 156, 73, 0.52);
    border-radius: 10px;
    background: radial-gradient(circle at 50% 42%, rgba(255, 208, 118, 0.78), rgba(232, 130, 47, 0.4) 56%, transparent 74%);
    box-shadow: 0 0 26px rgba(255, 179, 74, 0.36);
    opacity: 0.88;
    animation: nieuws-lantern-flicker-b-9qivt5y8y5 7.2s ease-in-out infinite;
}

.hero-atmosphere__raven[b-9qivt5y8y5] {
    position: absolute;
    right: 15%;
    top: 20%;
    width: 120px;
    height: 52px;
    background: radial-gradient(circle at 12% 68%, rgba(0, 0, 0, 0.62), transparent 62%), linear-gradient(95deg, rgba(28, 31, 36, 0.82), rgba(9, 10, 14, 0.42));
    clip-path: polygon(0 62%, 14% 49%, 29% 58%, 45% 35%, 66% 53%, 78% 42%, 100% 48%, 84% 62%, 66% 68%, 46% 74%, 31% 70%, 13% 75%);
    opacity: 0.56;
}

.hero-atmosphere__board[b-9qivt5y8y5] {
    position: absolute;
    right: 7%;
    bottom: 10%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 128px;
    min-height: 118px;
    border: 1px solid rgba(182, 128, 72, 0.58);
    background: linear-gradient(170deg, rgba(233, 211, 172, 0.88), rgba(182, 152, 108, 0.9));
    color: #3e2a15;
    font: 700 0.92rem/1.05 "IM Fell English", serif;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transform: rotate(-7deg);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
}

.newspaper[b-9qivt5y8y5] {
    transform: rotate(-0.15deg);
}

.newspaper[b-9qivt5y8y5]::after {
    content: "";
    position: absolute;
    inset: 8px;
    border: 1px dashed rgba(90, 61, 31, 0.42);
    pointer-events: none;
    opacity: 0.55;
    mix-blend-mode: multiply;
}

@keyframes nieuws-lantern-flicker-b-9qivt5y8y5 {
    0%,
    100% { opacity: 0.82; box-shadow: 0 0 19px rgba(255, 177, 74, 0.25); }
    32% { opacity: 0.96; box-shadow: 0 0 28px rgba(255, 177, 74, 0.41); }
    56% { opacity: 0.88; box-shadow: 0 0 23px rgba(255, 177, 74, 0.32); }
    77% { opacity: 1; box-shadow: 0 0 32px rgba(255, 177, 74, 0.45); }
}

@media (max-width: 900px) {
    .hero-atmosphere__board[b-9qivt5y8y5] {
        right: 3%;
        width: 104px;
        min-height: 98px;
        font-size: 0.8rem;
    }

    .hero-atmosphere__raven[b-9qivt5y8y5] {
        right: 8%;
        width: 88px;
        height: 38px;
    }
}

@media (max-width: 560px) {
    .hero-atmosphere__lantern[b-9qivt5y8y5],
    .hero-atmosphere__board[b-9qivt5y8y5],
    .hero-atmosphere__raven[b-9qivt5y8y5] {
        opacity: 0.42;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero-atmosphere__lantern[b-9qivt5y8y5] {
        animation: none;
    }
}
/* Nachtbode Hub Layout Overrides */
.nachtbode-hub .hub-hero-actions[b-9qivt5y8y5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 1.15rem;
}

.nachtbode-hub .hub-hero-actions .button-primary[b-9qivt5y8y5],
.nachtbode-hub .hub-hero-actions .button-ghost[b-9qivt5y8y5] {
    min-width: 184px;
}

.nachtbode-hub .hub-newspaper-grid[b-9qivt5y8y5] {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr) minmax(240px, 0.62fr);
    gap: 0.9rem;
    align-items: start;
}

.nachtbode-hub .hub-featured[b-9qivt5y8y5] {
    border-right: 1px solid rgba(66, 46, 24, 0.4);
    padding-right: 0.7rem;
}

.nachtbode-hub .hub-featured[b-9qivt5y8y5]  h3 {
    font-size: clamp(1.8rem, 2.7vw, 3rem);
}

.nachtbode-hub .hub-featured[b-9qivt5y8y5]  p {
    font-size: 0.84rem;
    line-height: 1.34;
}

.nachtbode-hub .hub-latest[b-9qivt5y8y5] {
    display: grid;
    gap: 0.35rem;
}

.nachtbode-hub .hub-latest-item + .hub-latest-item[b-9qivt5y8y5] {
    border-top: 1px solid rgba(78, 53, 28, 0.45);
}

.nachtbode-hub .hub-latest-item--breaking[b-9qivt5y8y5] {
    background: linear-gradient(180deg, rgba(151, 92, 28, 0.08), rgba(83, 44, 19, 0));
}

.nachtbode-hub .hub-latest-item--breaking[b-9qivt5y8y5]  .paper-category {
    color: #7b1710;
}

.nachtbode-hub .hub-sidebar[b-9qivt5y8y5] {
    display: grid;
    gap: 0.75rem;
    align-content: start;
    padding-left: 0.55rem;
    border-left: 1px solid rgba(67, 45, 23, 0.5);
}

.nachtbode-hub .hub-sidebar-block[b-9qivt5y8y5] {
    border: 1px solid rgba(65, 42, 20, 0.46);
    background: rgba(201, 173, 125, 0.18);
    padding: 0.65rem;
}

.nachtbode-hub .hub-sidebar-block h2[b-9qivt5y8y5],
.nachtbode-hub .hub-warning h2[b-9qivt5y8y5] {
    margin: 0;
    font: 900 0.78rem "Source Serif 4", serif;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.nachtbode-hub .hub-sidebar-block ul[b-9qivt5y8y5] {
    margin: 0.55rem 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.5rem;
}

.nachtbode-hub .hub-sidebar-block li[b-9qivt5y8y5] {
    display: grid;
    gap: 0.15rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px dotted rgba(70, 47, 23, 0.42);
}

.nachtbode-hub .hub-sidebar-block li:last-child[b-9qivt5y8y5] {
    border-bottom: 0;
    padding-bottom: 0;
}

.nachtbode-hub .hub-sidebar-block a[b-9qivt5y8y5] {
    color: inherit;
    text-decoration: none;
    font: 700 0.73rem/1.26 "Source Serif 4", serif;
}

.nachtbode-hub .hub-sidebar-block a:hover[b-9qivt5y8y5],
.nachtbode-hub .hub-sidebar-block a:focus-visible[b-9qivt5y8y5] {
    text-decoration: underline;
}

.nachtbode-hub .hub-sidebar-block small[b-9qivt5y8y5] {
    color: rgba(31, 22, 14, 0.72);
    font: 700 0.56rem "Source Serif 4", serif;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.nachtbode-hub .hub-warning[b-9qivt5y8y5] {
    border: 1px solid rgba(71, 44, 20, 0.58);
    background: linear-gradient(180deg, rgba(203, 154, 79, 0.22), rgba(178, 117, 57, 0.1));
    padding: 0.65rem;
}

.nachtbode-hub .hub-warning p[b-9qivt5y8y5] {
    margin: 0.45rem 0 0;
    font: 700 0.67rem/1.35 "Source Serif 4", serif;
    text-transform: uppercase;
}

.nachtbode-hub .hub-sidebar-actions[b-9qivt5y8y5] {
    display: grid;
    gap: 0.5rem;
}

.nachtbode-hub .hub-sidebar-actions .button-primary[b-9qivt5y8y5],
.nachtbode-hub .hub-sidebar-actions .button-ghost[b-9qivt5y8y5] {
    width: 100%;
    justify-content: center;
}

@media (max-width: 1080px) {
    .nachtbode-hub .hub-newspaper-grid[b-9qivt5y8y5] {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    }

    .nachtbode-hub .hub-sidebar[b-9qivt5y8y5] {
        grid-column: 1 / -1;
        grid-template-columns: 1fr 1fr;
        border-left: 0;
        border-top: 1px solid rgba(67, 45, 23, 0.5);
        padding: 0.85rem 0 0;
    }

    .nachtbode-hub .hub-sidebar-actions[b-9qivt5y8y5] {
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .nachtbode-hub .hub-newspaper-grid[b-9qivt5y8y5] {
        grid-template-columns: 1fr;
    }

    .nachtbode-hub .hub-featured[b-9qivt5y8y5] {
        border-right: 0;
        border-bottom: 1px solid rgba(66, 46, 24, 0.4);
        padding-right: 0;
        padding-bottom: 0.45rem;
    }

    .nachtbode-hub .hub-sidebar[b-9qivt5y8y5] {
        grid-template-columns: 1fr;
    }

    .nachtbode-hub .hub-sidebar-actions[b-9qivt5y8y5] {
        grid-template-columns: 1fr;
    }

    .nachtbode-hub .hub-hero-actions .button-primary[b-9qivt5y8y5],
    .nachtbode-hub .hub-hero-actions .button-ghost[b-9qivt5y8y5] {
        width: 100%;
        min-width: 0;
    }
}
/* /Components/Pages/NachtbodeArtikel.razor.rz.scp.css */
/* Styles for the auto-formatted article body output.
   These are scoped to NachtbodeArtikel.razor via Blazor's CSS isolation. */

/* Lead paragraph — larger, bolder first paragraph */
.nachtbode-lead[b-pllmn84xn5] {
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 1.1rem;
    text-indent: 0;
}

/* Auto-indented paragraph (follows another paragraph) */
.nachtbode-indent[b-pllmn84xn5] {
    text-indent: 1.5em;
}

/* Blockquote — double border, italic, centered attribution */
.nachtbode-blockquote[b-pllmn84xn5] {
    position: relative;
    margin: 1.4rem 0;
    padding: 1.2rem 1.4rem;
    border: 2px double #4d341b;
    background: rgba(245, 230, 200, 0.25);
}

.nachtbode-blockquote p[b-pllmn84xn5] {
    margin: 0;
    font-style: italic;
    font-family: "IM Fell English", serif;
    font-size: 1.1rem;
    line-height: 1.4;
}

.nachtbode-blockquote footer[b-pllmn84xn5] {
    margin-top: 0.7rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.nachtbode-blockquote cite[b-pllmn84xn5] {
    font-style: normal;
}

.nachtbode-blockquote small[b-pllmn84xn5] {
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
}

/* Divider */
.article-divider[b-pllmn84xn5] {
    border: none;
    border-top: 1px solid #4d341b;
    margin: 1.5rem 0;
}

/* Callout */
.article-callout[b-pllmn84xn5] {
    margin: 1.3rem 0;
    padding: 0.9rem 1.1rem;
    border-left: 4px solid #4d341b;
    background: rgba(245, 230, 200, 0.2);
    font-size: 0.92rem;
}

.article-callout strong[b-pllmn84xn5] {
    display: block;
    margin-bottom: 0.3rem;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.article-callout p[b-pllmn84xn5] {
    margin: 0;
}

/* Clue */
.article-clue[b-pllmn84xn5] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    margin: 1.2rem 0;
    padding: 0.8rem 1rem;
    border: 1px dashed #6a4a28;
    background: rgba(245, 230, 200, 0.15);
    font-size: 0.9rem;
}

.article-clue .clue-icon[b-pllmn84xn5] {
    font-size: 1.3rem;
    line-height: 1;
    flex-shrink: 0;
}

.article-clue p[b-pllmn84xn5] {
    margin: 0;
}

/* Headings rendered by the formatter */
.article-body h2[b-pllmn84xn5] {
    margin: 1.6rem 0 0.7rem;
    font: 700 1.15rem/1.2 "Cinzel", serif;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #3a2610;
}
/* /Components/Pages/Nieuws.razor.rz.scp.css */
.nachtbode-page[b-6lrnrbbfov] { --gold:#c8923c; --paper:#d2b987; --ink:#1d1710; min-height:100vh; padding-bottom:5rem; overflow:hidden; color:#e9dcc1; background:#040809 radial-gradient(circle at 9% 70%,rgba(74,34,91,.18),transparent 28%),radial-gradient(circle at 92% 74%,rgba(50,28,70,.2),transparent 25%); }
.nachtbode-page[b-6lrnrbbfov]::before { position:fixed; z-index:0; inset:0; pointer-events:none; opacity:.13; content:""; background:linear-gradient(90deg,transparent 49.5%,rgba(201,146,60,.18) 50%,transparent 50.5%),repeating-linear-gradient(110deg,rgba(255,255,255,.025) 0 1px,transparent 1px 8px); }
.nachtbode-loading[b-6lrnrbbfov],.nachtbode-error[b-6lrnrbbfov] { min-height:70vh; display:grid; place-content:center; text-align:center; font-family:"Cinzel",serif; }
.nachtbode-loading span[b-6lrnrbbfov] { font-size:clamp(2rem,8vw,6rem); color:var(--gold); }
.nachtbode-hero[b-6lrnrbbfov] { position:relative; z-index:1; min-height:clamp(320px,31vw,400px); isolation:isolate; background:#071011; }
.nachtbode-hero[b-6lrnrbbfov]::before { position:absolute; z-index:-2; inset:0; content:""; background-image:var(--hero-image); background-size:cover; background-position:var(--focus-x,75%) var(--focus-y,50%); }
.nachtbode-hero[b-6lrnrbbfov]::after { position:absolute; z-index:-1; inset:0; content:""; background:linear-gradient(90deg,rgba(5,8,10,.96) 0%,rgba(5,8,10,.72) 40%,rgba(5,8,10,.15) 75%,rgba(5,8,10,.35) 100%); }
.hero-copy[b-6lrnrbbfov] { width:min(1180px,92vw); margin:auto; padding:clamp(3.5rem,7vw,6rem) 0 3rem; }
.hero-copy h1[b-6lrnrbbfov] { max-width:720px; margin:.4rem 0; font:700 clamp(2.2rem,4.25vw,4.6rem)/.98 "Cinzel",serif; letter-spacing:-.04em; text-shadow:0 3px 24px #000; }
.hero-copy h1 em[b-6lrnrbbfov] { color:#d18b35; font-style:normal; }
.hero-ornament[b-6lrnrbbfov] { width:max-content; color:#bf7d2e; letter-spacing:.45em; }
.hero-subtitle[b-6lrnrbbfov] { margin:1rem 0 .7rem; color:#a774a7; font:700 clamp(.72rem,1vw,.95rem) "Cinzel",serif; letter-spacing:.12em; }
.hero-intro[b-6lrnrbbfov] { max-width:560px; margin:0; color:#d8c8aa; font:1rem/1.55 "Source Serif 4",serif; text-shadow:0 2px 8px #000; }
.announcement-strip[b-6lrnrbbfov] { position:relative; z-index:3; width:min(1100px,92vw); min-height:82px; margin:-1rem auto 1rem; display:grid; grid-template-columns:auto 220px 68px 1fr auto; gap:1rem; align-items:center; padding:.75rem 1.15rem; border:1px solid #765020; background:rgba(5,10,12,.97); box-shadow:0 10px 30px rgba(0,0,0,.35); }
.announcement-seal[b-6lrnrbbfov] { display:grid; width:42px; height:42px; place-content:center; border:1px solid #9d6a2d; border-radius:50%; color:#b97bb7; }
.announcement-label[b-6lrnrbbfov] { padding-right:1rem; border-right:1px solid #61431e; }
.announcement-label small[b-6lrnrbbfov] { color:#ca8c3c; font:600 .63rem "Cinzel",serif; letter-spacing:.08em; }
.announcement-label h2[b-6lrnrbbfov] { margin:.15rem 0 0; color:#e0c697; font:1.15rem "IM Fell English",serif; }
.announcement-strip time[b-6lrnrbbfov] { display:grid; justify-items:center; color:#af7cb1; font-family:"Cinzel",serif; }
.announcement-strip time strong[b-6lrnrbbfov] { font-size:1.4rem; }.announcement-strip time span[b-6lrnrbbfov] { font-size:.65rem; }
.announcement-copy strong[b-6lrnrbbfov] { color:#e4d6bb; font:600 .9rem "Source Serif 4",serif; }.announcement-copy p[b-6lrnrbbfov] { margin:.18rem 0 0; color:#ab9c83; font:.78rem/1.3 "Source Serif 4",serif; }
.announcement-strip>a[b-6lrnrbbfov] { color:#c99545; font:600 .62rem "Cinzel",serif; text-decoration:none; white-space:nowrap; }
.newspaper-shell[b-6lrnrbbfov] { position:relative; z-index:2; width:min(1150px,94vw); margin:0 auto; padding:0 12px 18px; filter:drop-shadow(0 24px 36px rgba(0,0,0,.75)); }
.newspaper[b-6lrnrbbfov] { position:relative; color:var(--ink); background-color:var(--paper); background-image:radial-gradient(circle at 8% 12%,rgba(75,42,14,.22),transparent 18%),radial-gradient(circle at 91% 88%,rgba(61,31,8,.2),transparent 21%),repeating-linear-gradient(8deg,rgba(255,255,255,.035) 0 2px,rgba(61,36,13,.025) 2px 4px),linear-gradient(107deg,#c6aa77,#dbc497 42%,#c3a572); border:1px solid #5b3a1d; box-shadow:0 20px 60px rgba(0,0,0,.65),0 0 60px rgba(181,106,31,.1),inset 0 0 50px rgba(62,34,12,.2); }
.newspaper[b-6lrnrbbfov]::before { position:absolute; z-index:4; inset:-5px; pointer-events:none; content:""; border:8px solid transparent; border-image:linear-gradient(115deg,#38210f,#a37a42 15%,#493018 55%,#bf9660 82%,#39200e) 12; opacity:.6; clip-path:polygon(1% 2%,5% 0,13% 1%,22% 0,35% 1%,47% 0,59% 1%,72% 0,87% 1%,99% 0,98% 12%,100% 23%,99% 37%,100% 49%,99% 64%,100% 81%,98% 99%,84% 98%,72% 100%,60% 99%,46% 100%,34% 99%,19% 100%,1% 98%,2% 84%,0 69%,1% 55%,0 39%,1% 22%); }
.masthead[b-6lrnrbbfov] { display:flex; justify-content:center; align-items:center; gap:2rem; padding:1.15rem 2rem .6rem; text-align:center; border-bottom:3px double #332412; }
.masthead small[b-6lrnrbbfov] { display:block; margin-bottom:-.6rem; font:700 1.1rem "IM Fell English",serif; }.masthead h2[b-6lrnrbbfov] { margin:0; font:900 clamp(3.2rem,7vw,6.2rem)/1 "IM Fell English",serif; letter-spacing:.04em; }
.masthead-raven[b-6lrnrbbfov],.masthead-moon[b-6lrnrbbfov] { font-size:clamp(2rem,5vw,4rem); }.masthead-moon[b-6lrnrbbfov] { transform:rotate(-15deg); }
.edition-line[b-6lrnrbbfov] { display:flex; flex-wrap:wrap; justify-content:center; gap:.45rem 1rem; padding:.42rem 1rem; border-bottom:1px solid #49341d; font:700 .64rem "Source Serif 4",serif; letter-spacing:.06em; text-transform:uppercase; }
.edition-line span:not(:last-child)[b-6lrnrbbfov]::after { padding-left:1rem; content:"◆"; font-size:.45rem; }
.newspaper-grid[b-6lrnrbbfov] { display:block; padding:clamp(1rem,4vw,3.2rem); }.nachtbode-article[b-6lrnrbbfov] { min-width:0; position:relative; }
.article-link[b-6lrnrbbfov],.nachtbode-article:not(.is-clickable)[b-6lrnrbbfov] { display:block; padding:.75rem; color:inherit; text-decoration:none; }
.nachtbode-article.is-clickable[b-6lrnrbbfov] { transition:transform .18s ease,box-shadow .18s ease,filter .18s ease; }.nachtbode-article.is-clickable:hover[b-6lrnrbbfov],.nachtbode-article.is-clickable:focus-within[b-6lrnrbbfov] { z-index:2; transform:translateY(-1px); filter:contrast(1.03); box-shadow:0 0 0 1px rgba(106,67,25,.25),0 4px 12px rgba(70,40,15,.15); }
.article-link:focus-visible[b-6lrnrbbfov] { outline:3px solid #744510; outline-offset:-4px; }
.nachtbode-article[b-6lrnrbbfov]  .paper-category { margin-bottom:.3rem; font:700 .58rem "Source Serif 4",serif; letter-spacing:.1em; }.nachtbode-article[b-6lrnrbbfov]  h3 { margin:0; font:900 clamp(1.35rem,2.3vw,2.65rem)/.95 "IM Fell English",serif; text-transform:uppercase; }.nachtbode-article[b-6lrnrbbfov]  h4 { margin:.4rem 0; font:700 clamp(.73rem,1vw,.92rem)/1.15 "Source Serif 4",serif; text-transform:uppercase; }.nachtbode-article[b-6lrnrbbfov]  img { width:100%; aspect-ratio:3/2; margin:.55rem 0; object-fit:cover; filter:sepia(.2) contrast(1.05) brightness(.88); transition:transform .18s ease; }.nachtbode-article:hover[b-6lrnrbbfov]  img { transform:scale(1.012); }.nachtbode-article[b-6lrnrbbfov]  p { margin:.35rem 0; font:.79rem/1.26 "Source Serif 4",serif; }.nachtbode-article[b-6lrnrbbfov]  .read-more { display:block; margin-top:.65rem; padding-top:.35rem; border-top:1px solid #5b4020; font:700 .56rem "Source Serif 4",serif; }.nachtbode-article[b-6lrnrbbfov]  .image-fallback { display:grid; min-height:80px; place-content:center; gap:.5rem; color:#3e2b18; font-size:1.6rem; opacity:.75; }
.area-sidebar[b-6lrnrbbfov]  .image-fallback { display:none; }
.area-sidebar .nachtbode-article:not(.is-clickable)[b-6lrnrbbfov] { padding:.5rem; }
.type-shortnews[b-6lrnrbbfov]  h3,.type-warning[b-6lrnrbbfov]  h3 { font-size:1rem; }.type-shortnews[b-6lrnrbbfov]  h4,.type-warning[b-6lrnrbbfov]  h4 { font-size:.67rem; }.type-shortnews[b-6lrnrbbfov]  p,.type-warning[b-6lrnrbbfov]  p { font-size:.68rem; }.area-bottomleft[b-6lrnrbbfov],.area-bottomcenter[b-6lrnrbbfov],.area-bottomright[b-6lrnrbbfov] { min-height:135px; }.area-bottomleft[b-6lrnrbbfov]  img,.area-bottomcenter[b-6lrnrbbfov]  img,.area-bottomright[b-6lrnrbbfov]  img { float:left; width:38%; margin:.3rem .6rem .2rem 0; }
.nachtbode-ad[b-6lrnrbbfov] { padding:.65rem .55rem; text-align:center; font-family:"Source Serif 4",serif; background:radial-gradient(circle,rgba(78,48,22,.08),transparent 70%); }
.nachtbode-ad img[b-6lrnrbbfov] { display:block; width:min(100%,170px); max-height:145px; margin:.25rem auto; object-fit:contain; filter:grayscale(1) sepia(.35) contrast(1.25); mix-blend-mode:multiply; }
.nachtbode-ad h3[b-6lrnrbbfov] { margin:.2rem 0; font:900 clamp(1rem,1.7vw,1.65rem)/.94 "IM Fell English",serif; }.nachtbode-ad h4[b-6lrnrbbfov] { margin:.25rem 0; font-size:.7rem; text-transform:uppercase; }.nachtbode-ad p[b-6lrnrbbfov] { margin:.3rem 0; font-size:.72rem; line-height:1.25; }.nachtbode-ad strong[b-6lrnrbbfov] { display:block; margin:.35rem 0; font-size:.65rem; }.nachtbode-ad small[b-6lrnrbbfov] { display:block; font-size:.52rem; line-height:1.2; font-style:italic; }
.ad-label[b-6lrnrbbfov] { font-size:.48rem; letter-spacing:.28em; }.ad-victorianbox[b-6lrnrbbfov],.ad-illustrated[b-6lrnrbbfov] { outline:3px double rgba(58,39,20,.75); outline-offset:-4px; }.ad-coupon[b-6lrnrbbfov] { border-block:2px dashed rgba(58,39,20,.65); }.ad-wantedstyle h3[b-6lrnrbbfov] { font-size:clamp(1.2rem,2vw,2rem); }.decorative-filler[b-6lrnrbbfov] { display:flex; justify-content:center; gap:.7rem; padding:1rem; }
.height-compact[b-6lrnrbbfov]{min-height:140px}.height-medium[b-6lrnrbbfov]{min-height:240px}.height-large[b-6lrnrbbfov]{min-height:360px}.height-custom[b-6lrnrbbfov]{min-height:var(--preferred-height,300px)}.aspect-square[b-6lrnrbbfov]  img{aspect-ratio:1}.aspect-fourthree[b-6lrnrbbfov]  img{aspect-ratio:4/3}.aspect-threetwo[b-6lrnrbbfov]  img{aspect-ratio:3/2}.aspect-sixteennine[b-6lrnrbbfov]  img{aspect-ratio:16/9}.aspect-twoone[b-6lrnrbbfov]  img{aspect-ratio:2/1}.aspect-portrait[b-6lrnrbbfov]  img{aspect-ratio:3/4}
.all-announcements[b-6lrnrbbfov] { width:min(1100px,92vw); margin:1rem auto; }.all-announcements article[b-6lrnrbbfov] { display:flex; gap:1rem; padding:1rem; border:1px solid #59401f; background:#071011; }.all-announcements h2[b-6lrnrbbfov] { margin:0; color:#d8c19a;font:1rem "Cinzel",serif; }.all-announcements p[b-6lrnrbbfov]{margin:.2rem 0;color:#aa9a80;}
.article-overlay[b-6lrnrbbfov] { position:fixed; z-index:1000; inset:0; display:grid; place-items:center; padding:4vh 2vw; background:rgba(2,5,7,.76); backdrop-filter:blur(4px); animation:overlay-in-b-6lrnrbbfov .18s ease both; }
.article-dialog[b-6lrnrbbfov] { width:min(1000px,88vw); max-height:90vh; overflow:auto; padding:1.3rem 2.4rem 1.5rem; animation:dialog-in-b-6lrnrbbfov .24s ease both; outline:none; }.modal-close[b-6lrnrbbfov] { position:sticky; z-index:10; top:0; float:right; width:44px;height:44px;margin:-.8rem -1.8rem 0 0;border:1px solid #b77627;border-radius:50%;color:#e8b45d;background:#071014;font-size:1.8rem;line-height:1;box-shadow:0 0 18px rgba(183,118,39,.25);}.modal-close:hover[b-6lrnrbbfov],.modal-close:focus-visible[b-6lrnrbbfov]{border-color:#e2a64c;box-shadow:0 0 24px rgba(224,154,57,.5);}
.modal-masthead[b-6lrnrbbfov] { padding:.2rem 3rem .65rem; }.modal-masthead h2[b-6lrnrbbfov] { font-size:clamp(2.7rem,7vw,5.2rem); }.modal-masthead p[b-6lrnrbbfov]{margin:0;font:700 .8rem "Cinzel",serif;letter-spacing:.2em;}.article-heading[b-6lrnrbbfov]{text-align:center;padding:1rem 0}.article-heading h1[b-6lrnrbbfov]{margin:0;font:900 clamp(2.2rem,5vw,4rem)/.96 "IM Fell English",serif;text-transform:uppercase}.article-heading>p[b-6lrnrbbfov]{margin:.6rem 0;font:700 clamp(.95rem,1.7vw,1.3rem) "Source Serif 4",serif;text-transform:uppercase}.article-meta[b-6lrnrbbfov]{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 1.4rem;margin-top:.8rem;font:700 .67rem "Source Serif 4",serif;letter-spacing:.05em}.article-visual-grid[b-6lrnrbbfov]{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(210px,.8fr);gap:1rem}.article-visual-grid>img[b-6lrnrbbfov]{width:100%;height:100%;max-height:430px;object-fit:cover;border:1px solid #4d341b;filter:sepia(.22) contrast(1.06) brightness(.9)}.article-visual-grid aside[b-6lrnrbbfov]{display:grid;gap:.8rem}.article-visual-grid blockquote[b-6lrnrbbfov]{position:relative;margin:0;padding:1.2rem;border:2px double #44301b;text-align:center}.article-visual-grid blockquote>span[b-6lrnrbbfov]{position:absolute;top:-.25rem;left:.7rem;font-size:3.8rem}.article-visual-grid blockquote p[b-6lrnrbbfov]{margin:1.2rem 0 .7rem;font:italic 1.35rem/1.15 "IM Fell English",serif}.article-visual-grid cite[b-6lrnrbbfov]{font:700 .65rem "Source Serif 4",serif;text-transform:uppercase}.sidebar-notes[b-6lrnrbbfov]{border:1px solid #4c351d;padding:.65rem}.sidebar-notes>h2[b-6lrnrbbfov]{margin:0 0 .4rem;padding-bottom:.35rem;border-bottom:1px solid #5c4020;text-align:center;font:900 .8rem "Source Serif 4",serif}.sidebar-notes article[b-6lrnrbbfov]{display:flex;gap:.6rem;padding:.45rem 0;border-bottom:1px dotted #6a4a28}.sidebar-notes h3[b-6lrnrbbfov],.sidebar-notes p[b-6lrnrbbfov]{margin:0}.sidebar-notes h3[b-6lrnrbbfov]{font:700 .68rem "Source Serif 4",serif;text-transform:uppercase}.sidebar-notes p[b-6lrnrbbfov]{font:.64rem/1.25 "Source Serif 4",serif}.article-body[b-6lrnrbbfov]{padding:1.1rem 0;font:1rem/1.48 "Source Serif 4",serif}.article-body--columns[b-6lrnrbbfov]{column-count:2;column-gap:2rem;column-rule:1px solid rgba(63,41,21,.35)}.article-body p[b-6lrnrbbfov]{margin:0 0 .85rem}.article-body p:first-of-type[b-6lrnrbbfov]::first-letter{float:left;margin:.05em .1em 0 0;font:900 4.3rem/.72 "IM Fell English",serif}.article-body h2[b-6lrnrbbfov],.article-body blockquote[b-6lrnrbbfov]{break-inside:avoid}.article-footer[b-6lrnrbbfov]{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;border-top:2px double #51371c;border-bottom:1px solid #51371c;font:700 .75rem "Source Serif 4",serif;letter-spacing:.04em}.article-loading[b-6lrnrbbfov]{display:grid;min-height:50vh;place-content:center;text-align:center;font:1.2rem "Cinzel",serif}
@keyframes overlay-in-b-6lrnrbbfov{from{opacity:0}to{opacity:1}}@keyframes dialog-in-b-6lrnrbbfov{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:850px){.announcement-strip[b-6lrnrbbfov]{grid-template-columns:auto 1fr auto}.announcement-copy[b-6lrnrbbfov]{grid-column:2/4}.announcement-strip>a[b-6lrnrbbfov]{display:none}.newspaper-grid[b-6lrnrbbfov]{grid-template-columns:1.3fr 1fr;grid-template-areas:"leadleft leadright" "sidebar sidebar" "bottomleft bottomleft" "bottomcenter bottomright"}.article-area.area-sidebar[b-6lrnrbbfov]{display:grid;grid-template-columns:repeat(4,1fr)}.article-visual-grid[b-6lrnrbbfov]{grid-template-columns:1fr}.article-visual-grid aside[b-6lrnrbbfov]{grid-template-columns:1fr 1fr}.article-dialog[b-6lrnrbbfov]{padding:1rem 1.4rem}.modal-close[b-6lrnrbbfov]{margin:-.55rem -.9rem 0 0}}
@media(max-width:560px){.nachtbode-hero[b-6lrnrbbfov]{min-height:360px}.nachtbode-hero[b-6lrnrbbfov]::after{background:linear-gradient(90deg,rgba(5,8,10,.94),rgba(5,8,10,.55))}.hero-copy[b-6lrnrbbfov]{padding-top:4.5rem}.announcement-strip[b-6lrnrbbfov]{width:calc(100% - 20px);grid-template-columns:auto 1fr;margin:-.6rem auto .8rem}.announcement-label[b-6lrnrbbfov]{border:0}.announcement-strip time[b-6lrnrbbfov]{grid-row:2}.announcement-copy[b-6lrnrbbfov]{grid-column:2}.newspaper-shell[b-6lrnrbbfov]{width:calc(100% - 12px);padding:0}.masthead[b-6lrnrbbfov]{gap:.8rem;padding:1rem .5rem}.masthead h2[b-6lrnrbbfov]{font-size:clamp(2.5rem,15vw,4rem)}.edition-line[b-6lrnrbbfov]{gap:.25rem .5rem;font-size:.52rem}.edition-line span:not(:last-child)[b-6lrnrbbfov]::after{padding-left:.5rem}.newspaper-grid[b-6lrnrbbfov]{display:flex;flex-direction:column;padding:.55rem}.area-leadleft[b-6lrnrbbfov]{order:1}.area-leadright[b-6lrnrbbfov]{order:2}.article-area.area-sidebar[b-6lrnrbbfov]{display:block;order:3}.area-bottomleft[b-6lrnrbbfov]{order:5}.area-bottomcenter[b-6lrnrbbfov]{order:6}.area-bottomright[b-6lrnrbbfov]{order:7}.nachtbode-article[b-6lrnrbbfov]{border-right:0}.area-bottomleft[b-6lrnrbbfov]  img,.area-bottomcenter[b-6lrnrbbfov]  img,.area-bottomright[b-6lrnrbbfov]  img{float:none;width:100%}.type-shortnews[b-6lrnrbbfov]  h3,.type-warning[b-6lrnrbbfov]  h3{font-size:1.3rem}.article-overlay[b-6lrnrbbfov]{padding:10px}.article-dialog[b-6lrnrbbfov]{width:calc(100vw - 20px);max-height:calc(100vh - 20px);padding:.7rem}.modal-close[b-6lrnrbbfov]{margin:0}.modal-masthead h2[b-6lrnrbbfov]{font-size:2.7rem}.article-heading h1[b-6lrnrbbfov]{font-size:2.1rem}.article-visual-grid aside[b-6lrnrbbfov]{grid-template-columns:1fr}.article-body--columns[b-6lrnrbbfov]{column-count:1}.article-footer[b-6lrnrbbfov]{font-size:.58rem;text-align:center}}
@media(prefers-reduced-motion:reduce){.nachtbode-article[b-6lrnrbbfov],.nachtbode-article[b-6lrnrbbfov]  img,.article-overlay[b-6lrnrbbfov],.article-dialog[b-6lrnrbbfov]{animation:none!important;transition:none!important}}

/* Nachtbode Hero Atmosphere Overrides */
.nachtbode-hero[b-6lrnrbbfov]::after { background:linear-gradient(94deg,rgba(4,7,10,.9) 0%,rgba(5,8,10,.6) 39%,rgba(8,13,20,.24) 70%,rgba(6,10,15,.46) 100%); }

.hero-atmosphere[b-6lrnrbbfov] {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.hero-atmosphere__lantern[b-6lrnrbbfov] {
    position: absolute;
    left: 7%;
    top: 16%;
    width: 34px;
    height: 112px;
    border: 1px solid rgba(224, 156, 73, 0.52);
    border-radius: 10px;
    background: radial-gradient(circle at 50% 42%, rgba(255, 208, 118, 0.78), rgba(232, 130, 47, 0.4) 56%, transparent 74%);
    box-shadow: 0 0 26px rgba(255, 179, 74, 0.36);
    opacity: 0.88;
    animation: nieuws-lantern-flicker-b-6lrnrbbfov 7.2s ease-in-out infinite;
}

.hero-atmosphere__raven[b-6lrnrbbfov] {
    position: absolute;
    right: 15%;
    top: 20%;
    width: 120px;
    height: 52px;
    background: radial-gradient(circle at 12% 68%, rgba(0, 0, 0, 0.62), transparent 62%), linear-gradient(95deg, rgba(28, 31, 36, 0.82), rgba(9, 10, 14, 0.42));
    clip-path: polygon(0 62%, 14% 49%, 29% 58%, 45% 35%, 66% 53%, 78% 42%, 100% 48%, 84% 62%, 66% 68%, 46% 74%, 31% 70%, 13% 75%);
    opacity: 0.56;
}

.hero-atmosphere__board[b-6lrnrbbfov] {
    position: absolute;
    right: 7%;
    bottom: 10%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 128px;
    min-height: 118px;
    border: 1px solid rgba(182, 128, 72, 0.58);
    background: linear-gradient(170deg, rgba(233, 211, 172, 0.88), rgba(182, 152, 108, 0.9));
    color: #3e2a15;
    font: 700 0.92rem/1.05 "IM Fell English", serif;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transform: rotate(-7deg);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
}

.newspaper[b-6lrnrbbfov] {
    transform: rotate(-0.15deg);
}

.newspaper[b-6lrnrbbfov]::after {
    content: "";
    position: absolute;
    inset: 8px;
    border: 1px dashed rgba(90, 61, 31, 0.42);
    pointer-events: none;
    opacity: 0.55;
    mix-blend-mode: multiply;
}

@keyframes nieuws-lantern-flicker-b-6lrnrbbfov {
    0%,
    100% { opacity: 0.82; box-shadow: 0 0 19px rgba(255, 177, 74, 0.25); }
    32% { opacity: 0.96; box-shadow: 0 0 28px rgba(255, 177, 74, 0.41); }
    56% { opacity: 0.88; box-shadow: 0 0 23px rgba(255, 177, 74, 0.32); }
    77% { opacity: 1; box-shadow: 0 0 32px rgba(255, 177, 74, 0.45); }
}

@media (max-width: 900px) {
    .hero-atmosphere__board[b-6lrnrbbfov] {
        right: 3%;
        width: 104px;
        min-height: 98px;
        font-size: 0.8rem;
    }

    .hero-atmosphere__raven[b-6lrnrbbfov] {
        right: 8%;
        width: 88px;
        height: 38px;
    }
}

@media (max-width: 560px) {
    .hero-atmosphere__lantern[b-6lrnrbbfov],
    .hero-atmosphere__board[b-6lrnrbbfov],
    .hero-atmosphere__raven[b-6lrnrbbfov] {
        opacity: 0.42;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero-atmosphere__lantern[b-6lrnrbbfov] {
        animation: none;
    }
}

/* ─────────────────────────────────────────────────────────────────────────────
   NIEUWS FRONTPAGE — three independent vertical newspaper columns.

   Two separate causes produced large empty areas on this page, and both are now
   gone by construction:

   1. A shared editorial-row grid made every "row" as tall as its tallest cell, so
      a short cell left a void next to a tall one. There is no row structure left:
      the first child of the newspaper grid is one column container per column.

   2. A full-width band after the columns (the bottom positions, with a border-top
      across the whole paper) was a shared row again: it could only start below the
      TALLEST column, which measured 532px of void under column 1 and 932px under
      column 2 whenever the sidebar was taller. Those articles are now the tail of
      their own column, so nothing waits for a sibling's height.

   Every item is a direct child of its own column, columns are `align-self: start`
   so they never stretch, and nothing is equalised: no height:100%, no fixed card
   height, no JavaScript or ResizeObserver. The colophon below the grid is a
   decorative closing rule, not content, so it cannot delay an article.

   The three fixed grid areas are the only place where a physical column is
   decided; CSS automatic placement never chooses a column for an article.

     column 1  .column-left     LeadLeft  + BottomLeft    wide lead column
     column 2  .column-middle   LeadRight + BottomCenter  the MIDDLE column
     column 3  .column-sidebar  Sidebar*  + BottomRight   the right-hand edge
   ────────────────────────────────────────────────────────────────────────── */
.nachtbode-columns[b-6lrnrbbfov] {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(170px, .65fr);
    grid-template-areas: "column-left column-middle column-sidebar";
    gap: clamp(22px, 2.6vw, 40px);
    align-items: start;
}

.column-left[b-6lrnrbbfov] { grid-area: column-left; }
.column-middle[b-6lrnrbbfov] { grid-area: column-middle; }
.column-sidebar[b-6lrnrbbfov] { grid-area: column-sidebar; }

/* One column = one independent vertical flow, growing with its own content. */
.nachtbode-column[b-6lrnrbbfov] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    align-self: start;
    gap: 28px;
    min-width: 0;
    height: auto;
    min-height: 0;
}

.nachtbode-column > *[b-6lrnrbbfov] {
    min-width: 0;
    height: auto;
}

/* The sidebar: a narrow stack of compact items, visually separated inside its own
   column only. Its height never affects the other two columns. */
.column-sidebar[b-6lrnrbbfov] {
    gap: 18px;
    padding-left: clamp(10px, 1.2vw, 18px);
    border-left: 3px double #332412;
}

.column-sidebar > * + *[b-6lrnrbbfov] {
    padding-top: 14px;
    border-top: 1px dashed rgba(72, 47, 20, .4);
}

/* Compact sidebar cards: a small heading, a clamped teaser and a modest image
   instead of the full-size lead layout. */
.column-sidebar[b-6lrnrbbfov]  .sidebar-card h3 {
    font-size: clamp(.95rem, 1.15vw, 1.25rem);
    line-height: 1.05;
}

.column-sidebar[b-6lrnrbbfov]  .sidebar-card h4 { font-size: .68rem; }

.column-sidebar[b-6lrnrbbfov]  .sidebar-card p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    font-size: .72rem;
}

.column-sidebar[b-6lrnrbbfov]  .sidebar-card img {
    aspect-ratio: 4/3;
    max-height: 130px;
    margin: .35rem 0;
}

.column-sidebar[b-6lrnrbbfov]  .sidebar-card .read-more { display: none; }

.column-sidebar[b-6lrnrbbfov]  .nachtbode-ad img { max-height: 110px; }
.column-sidebar[b-6lrnrbbfov]  .nachtbode-ad h3 { font-size: clamp(.95rem, 1.2vw, 1.3rem); }

/* Kill legacy article-page margins/width that inflated every cell
   (global app.css: .nachtbode-article { margin: calc(76px + 2rem) auto 5rem }).
   Content height decides — fixed min-heights created the empty holes. */
.newspaper[b-6lrnrbbfov]  .nachtbode-article,
.newspaper[b-6lrnrbbfov]  .editorial-article {
    width: auto;
    max-width: none;
    margin: 0;
}

.newspaper[b-6lrnrbbfov]  .editorial-article.height-compact,
.newspaper[b-6lrnrbbfov]  .editorial-article.height-medium,
.newspaper[b-6lrnrbbfov]  .editorial-article.height-large,
.newspaper[b-6lrnrbbfov]  .editorial-article.height-custom,
.newspaper[b-6lrnrbbfov]  .area-bottomleft,
.newspaper[b-6lrnrbbfov]  .area-bottomcenter,
.newspaper[b-6lrnrbbfov]  .area-bottomright,
.newspaper[b-6lrnrbbfov]  .nachtbode-ad {
    min-height: 0;
}

/* Natural Dutch hyphenation & wrapping; never hard-truncate teasers. */
.newspaper-grid[b-6lrnrbbfov] { overflow: visible; overflow-wrap: break-word; }
.nachtbode-column[b-6lrnrbbfov] { hyphens: auto; overflow-wrap: break-word; }

/* The paper sheet ends right after the last block — no A4-like height.
   Trim the large legacy .newspaper padding (app.css clamp(1.5rem,5vw,4rem))
   on the bottom edge so the sheet closes immediately under the colophon. */
.newspaper[b-6lrnrbbfov] { height: auto; min-height: 0; padding-bottom: clamp(.9rem, 1.8vw, 1.6rem); }
.newspaper-grid[b-6lrnrbbfov] { padding-bottom: clamp(.35rem, 1vw, .8rem); }
.newspaper-shell[b-6lrnrbbfov] { overflow: visible; }

/* Responsive: 3 → 2 → 1 columns, in the same logical order (links, midden, zijbalk).
   The columns stay independent containers at every width: nothing is re-flowed
   between them, only their position on the page changes. */
@media (max-width: 1060px) and (min-width: 681px) {
    .nachtbode-columns[b-6lrnrbbfov] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas: "column-left column-middle" "column-sidebar column-sidebar";
    }

    /* The sidebar becomes a strip of compact items under the two lead columns. */
    .column-sidebar[b-6lrnrbbfov] {
        flex-direction: row;
        flex-wrap: wrap;
        padding-left: 0;
        padding-top: clamp(14px, 2vw, 26px);
        border-left: 0;
        border-top: 3px double #332412;
    }

    .column-sidebar > *[b-6lrnrbbfov] { flex: 1 1 220px; }
    .column-sidebar > * + *[b-6lrnrbbfov] { padding-top: 0; border-top: 0; }
}

@media (max-width: 680px) {
    .nachtbode-columns[b-6lrnrbbfov] {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "column-left" "column-middle" "column-sidebar";
        gap: 26px;
    }

    .column-sidebar[b-6lrnrbbfov] {
        flex-direction: column;
        padding-left: 0;
        padding-top: clamp(12px, 3vw, 20px);
        border-left: 0;
        border-top: 3px double #332412;
    }

    .column-sidebar > *[b-6lrnrbbfov] { width: 100%; flex: 1 1 auto; }
    .newspaper-grid[b-6lrnrbbfov] { padding: .55rem; }
}

/* Colophon: designed closing strip of the paper sheet. */
.newspaper-colophon[b-6lrnrbbfov] {
    margin-top: clamp(24px, 3vw, 48px);
    padding-top: .9rem;
    border-top: 3px double #332412;
    display: flex;
    justify-content: center;
    gap: .9rem;
    align-items: center;
    text-align: center;
    font: 700 .62rem/1.3 "Source Serif 4", serif;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #3a2814;
}

.newspaper-colophon i[b-6lrnrbbfov] { font-style: normal; color: #a3702c; font-size: .5rem; }

@media (max-width: 560px) {
    .newspaper-colophon[b-6lrnrbbfov] { flex-wrap: wrap; gap: .35rem 1rem; }
}

/* Premium Nachtbode environment: one visual system for the page and hero. */
.nachtbode-page[b-6lrnrbbfov] {
    position: relative;
    isolation: isolate;
    background: #0a0b0d;
}

.nachtbode-page[b-6lrnrbbfov]::before {
    position: fixed;
    z-index: 0;
    inset: 0;
    content: "";
    pointer-events: none;
    opacity: 1;
    background:
        linear-gradient(180deg, rgba(5, 9, 11, .12), rgba(5, 9, 11, .48) 72%, rgba(4, 7, 8, .72)),
        url('/assets/nachtbode/news-page-background.webp') center top / cover no-repeat;
}

.nachtbode-page[b-6lrnrbbfov]::after {
    position: fixed;
    z-index: 0;
    inset: 0;
    content: "";
    pointer-events: none;
    opacity: .42;
    background:
        radial-gradient(ellipse at 50% 42%, rgba(15, 29, 32, .05) 0 25%, rgba(3, 6, 8, .56) 86%),
        repeating-linear-gradient(108deg, rgba(231, 220, 203, .018) 0 1px, transparent 1px 9px);
}

.nachtbode-loading[b-6lrnrbbfov],
.nachtbode-error[b-6lrnrbbfov],
.all-announcements[b-6lrnrbbfov] { position: relative; z-index: 2; }

.nachtbode-hero[b-6lrnrbbfov] {
    min-height: clamp(400px, 35vw, 520px);
    overflow: hidden;
    border-bottom: 1px solid rgba(184, 138, 59, .42);
    background: #0e1a1d;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .48);
}

.nachtbode-hero[b-6lrnrbbfov]::before {
    background-position: var(--focus-x, 62%) var(--focus-y, 50%);
    filter: saturate(.88) contrast(1.04);
    transform: scale(1.015);
}

.nachtbode-hero[b-6lrnrbbfov]::after {
    background:
        linear-gradient(90deg, rgba(5, 9, 11, .98) 0%, rgba(7, 13, 15, .92) 22%, rgba(8, 15, 18, .60) 46%, rgba(7, 12, 15, .10) 74%, rgba(5, 8, 10, .30) 100%),
        linear-gradient(180deg, rgba(6, 10, 12, .22), transparent 52%, rgba(5, 8, 10, .68));
}

.hero-copy[b-6lrnrbbfov] {
    position: relative;
    z-index: 1;
    padding-top: clamp(4.8rem, 8vw, 7.2rem);
    padding-bottom: clamp(3.5rem, 6vw, 5.5rem);
}

.hero-copy[b-6lrnrbbfov]::before {
    position: absolute;
    top: clamp(3.6rem, 6vw, 5.2rem);
    left: -1.1rem;
    width: 1px;
    height: calc(100% - 7rem);
    content: "";
    background: linear-gradient(transparent, rgba(184, 138, 59, .85) 22%, rgba(184, 138, 59, .28) 78%, transparent);
    box-shadow: 0 0 18px rgba(213, 161, 91, .24);
}

.hero-copy h1[b-6lrnrbbfov] {
    max-width: 760px;
    color: #e7dccb;
    font-size: clamp(2.7rem, 4.8vw, 5.2rem);
    letter-spacing: -.045em;
    text-shadow: 0 3px 28px rgba(0, 0, 0, .95), 0 0 36px rgba(14, 26, 29, .8);
}

.hero-copy h1 em[b-6lrnrbbfov] { color: #d5a15b; }
.hero-ornament[b-6lrnrbbfov] { color: #b88a3b; opacity: .9; }
.hero-subtitle[b-6lrnrbbfov] { color: #c29ac1; }
.hero-intro[b-6lrnrbbfov] { color: #e0d4c0; }

.announcement-strip[b-6lrnrbbfov] {
    border-color: rgba(184, 138, 59, .68);
    background: linear-gradient(105deg, rgba(7, 15, 17, .98), rgba(13, 24, 27, .97));
    box-shadow: 0 16px 42px rgba(0, 0, 0, .56), 0 0 30px rgba(184, 138, 59, .08);
}

.newspaper-shell[b-6lrnrbbfov] {
    margin-top: clamp(.5rem, 1.5vw, 1.25rem);
    filter: drop-shadow(0 30px 42px rgba(0, 0, 0, .82));
}

@media (max-width: 680px) {
    .nachtbode-page[b-6lrnrbbfov]::before {
        background:
            linear-gradient(180deg, rgba(5, 9, 11, .30), rgba(5, 9, 11, .64)),
            url('/assets/nachtbode/news-page-background.webp') center top / auto 100vh no-repeat,
            #0a0b0d;
    }

    .nachtbode-hero[b-6lrnrbbfov] { min-height: 430px; }
    .nachtbode-hero[b-6lrnrbbfov]::before { background-position: 66% center; }
    .nachtbode-hero[b-6lrnrbbfov]::after {
        background: linear-gradient(90deg, rgba(5, 9, 11, .96), rgba(7, 13, 15, .74) 64%, rgba(5, 9, 11, .38));
    }
    .hero-copy[b-6lrnrbbfov] { padding-top: 5.2rem; padding-bottom: 3.4rem; }
    .hero-copy h1[b-6lrnrbbfov] { max-width: 92%; font-size: clamp(2.45rem, 12vw, 3.65rem); }
    .hero-copy[b-6lrnrbbfov]::before { display: none; }
}
/* /Components/Pages/Spelletjes.razor.rz.scp.css */
.games-world[b-4xfo6trdyc] {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    padding-bottom: clamp(3rem, 7vw, 7rem);
    background-image:
        linear-gradient(180deg, rgba(3, 7, 13, .08) 0, rgba(3, 7, 13, .3) 36rem, rgba(3, 7, 13, .76) 100%),
        url('/assets/halloween/games/games-world-v2.webp');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.games-world[b-4xfo6trdyc]::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(ellipse at 50% 34%, transparent 0 35%, rgba(2, 5, 10, .42) 82%);
}

.games-landing[b-4xfo6trdyc] {
    width: min(1160px, calc(100% - 2rem));
    margin-inline: auto;
    padding-top: clamp(7.2rem, 10vw, 9rem);
    text-align: center;
}

.games-landing__ornament[b-4xfo6trdyc] {
    display: block;
    width: 210px;
    height: 1px;
    margin: 0 auto .85rem;
    background: linear-gradient(90deg, transparent, #bd7c35 20%, #f0c77a 50%, #bd7c35 80%, transparent);
    box-shadow: 0 0 18px rgba(241, 164, 70, .25);
}

.games-landing__copy[b-4xfo6trdyc] { text-shadow: 0 3px 18px #02050a, 0 1px 2px #02050a; }

.games-landing__copy h1[b-4xfo6trdyc] {
    margin: 0;
    color: #f5e8cf;
    font-family: var(--display);
    font-size: clamp(3rem, 6.5vw, 5.8rem);
    letter-spacing: -.045em;
    text-transform: uppercase;
}

.games-landing__copy p[b-4xfo6trdyc] {
    max-width: 720px;
    margin: .65rem auto 1.25rem;
    color: #eee1ce;
    font-family: Georgia, serif;
    font-size: clamp(.96rem, 1.5vw, 1.14rem);
    line-height: 1.45;
}

.games-landing__kicker[b-4xfo6trdyc] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .75rem;
    color: #efb35c;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .36em;
    text-transform: uppercase;
}

.games-landing__kicker i[b-4xfo6trdyc] {
    width: 4px;
    height: 4px;
    transform: rotate(45deg);
    background: #ba6e37;
    box-shadow: 0 0 8px #e89d4f;
}

.game-tabs[b-4xfo6trdyc] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    margin: 1rem 0 0;
    text-align: left;
}

.game-tabs .game-choice[b-4xfo6trdyc] {
    position: relative;
    min-height: 138px;
    display: grid;
    grid-template-columns: 37% 1fr;
    grid-template-rows: none;
    gap: .75rem;
    overflow: hidden;
    padding: .55rem .7rem .55rem .45rem;
    border: 1px solid rgba(209, 148, 72, .5);
    border-radius: 5px;
    background: linear-gradient(145deg, rgba(7, 13, 20, .96), rgba(12, 13, 25, .88));
    box-shadow: inset 0 0 0 3px rgba(2, 5, 10, .72), 0 12px 28px rgba(0, 0, 0, .38);
    color: #f5e8cf;
    cursor: pointer;
    transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.game-tabs .game-choice[b-4xfo6trdyc]::after {
    content: "";
    position: absolute;
    inset: 5px;
    border: 1px solid rgba(243, 201, 124, .08);
    pointer-events: none;
}

.game-tabs .game-choice:hover[b-4xfo6trdyc] { transform: translateY(-3px); border-color: #dfa551; }
.game-tabs .game-choice.active[b-4xfo6trdyc] {
    border-color: #f2ad4f;
    box-shadow: inset 0 0 0 3px rgba(47, 18, 54, .82), 0 0 0 1px #8c4e91, 0 0 24px rgba(198, 87, 220, .42), 0 16px 34px #0009;
}

.game-choice__art[b-4xfo6trdyc] {
    align-self: stretch;
    min-width: 0;
    width: auto;
    height: auto;
    grid-row: auto;
    border-right: 1px solid rgba(216, 153, 75, .24);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    filter: saturate(.92) contrast(1.06);
}

.game-choice--ghost .game-choice__art[b-4xfo6trdyc] {
    background-image: radial-gradient(circle, rgba(129, 99, 175, .28), transparent 64%), url('/assets/halloween/characters/ghost1.png');
    background-size: cover, contain;
}
.game-choice--witch .game-choice__art[b-4xfo6trdyc] { background-image: url('/assets/monsterboek/chapters/chapter-heks-hilde.png'); }
.game-choice--memory .game-choice__art[b-4xfo6trdyc] { background-image: url('/assets/monsterboek/chapters/chapter-baron-bottenstein.png'); }

.game-tabs .game-choice > .game-choice__copy[b-4xfo6trdyc] {
    width: auto;
    height: auto;
    grid-row: auto;
    align-self: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}
.game-choice__copy strong[b-4xfo6trdyc] { font-family: var(--display); font-size: clamp(.82rem, 1.2vw, 1rem); line-height: 1.12; }
.game-choice__copy small[b-4xfo6trdyc] { margin: .45rem 0 .65rem; color: #c9c0c7; font-size: .72rem; line-height: 1.35; }
.game-choice__copy b[b-4xfo6trdyc] {
    align-self: flex-start;
    min-width: 104px;
    padding: .38rem .6rem;
    border: 1px solid #a96f37;
    color: #f1bd69;
    font-size: .6rem;
    letter-spacing: .1em;
    text-align: center;
    text-transform: uppercase;
}
.game-choice__copy b i[b-4xfo6trdyc] { margin-left: .3rem; font-style: normal; }

.games-session[b-4xfo6trdyc] {
    display: flex;
    justify-content: center;
    gap: 2rem;
    width: max-content;
    max-width: 100%;
    margin: .7rem auto 0;
    padding: .45rem 1rem;
    border: 1px solid rgba(201, 145, 72, .28);
    background: rgba(4, 9, 15, .7);
    backdrop-filter: blur(8px);
}
.games-session span[b-4xfo6trdyc], .games-session a[b-4xfo6trdyc] { display: flex; gap: .5rem; align-items: baseline; }
.games-session small[b-4xfo6trdyc] { color: #a8a0a7; font-size: .55rem; letter-spacing: .1em; text-transform: uppercase; }
.games-session strong[b-4xfo6trdyc] { color: #e8c183; font-size: .67rem; }

.games-page.section-pad[b-4xfo6trdyc] {
    width: min(1240px, calc(100% - 2rem));
    padding-block: 1rem 0;
}

.memory-masthead[b-4xfo6trdyc] {
    display: grid;
    grid-template-columns: auto minmax(280px, .9fr) minmax(420px, 1.25fr);
    align-items: center;
    gap: 1rem;
    min-height: 105px;
    padding: .9rem 1.25rem;
    border: 1px solid rgba(213, 157, 74, .58);
    border-bottom: 0;
    background: linear-gradient(100deg, rgba(4, 13, 20, .97), rgba(8, 16, 26, .94));
    box-shadow: 0 18px 50px #0008;
}

.memory-emblem[b-4xfo6trdyc] {
    width: 68px;
    height: 68px;
    display: grid;
    place-items: center;
    border: 2px solid #9d5eb0;
    border-radius: 50%;
    background: radial-gradient(circle, #5f2a6e 0 22%, #171324 70%);
    box-shadow: inset 0 0 0 5px #0b1019, 0 0 18px rgba(195, 91, 220, .42);
    color: #dc86ee;
    font-family: var(--display);
    font-size: 2rem;
}

.memory-masthead__title span[b-4xfo6trdyc],
.memory-masthead__title p[b-4xfo6trdyc] { color: #a9a0aa; font-size: .58rem; letter-spacing: .17em; text-transform: uppercase; }
.memory-masthead__title h2[b-4xfo6trdyc] { margin: .2rem 0; color: #f3e3ca; font-size: clamp(1.45rem, 2.5vw, 2.2rem); letter-spacing: -.03em; }
.memory-masthead__title p[b-4xfo6trdyc] { margin: 0; color: #d2c2b1; }

.memory-route[b-4xfo6trdyc] { border-left: 1px solid rgba(207, 151, 71, .24); padding-left: 1rem; }
.memory-route > p[b-4xfo6trdyc] { margin: 0 0 .5rem; color: #cabdb1; font-size: .69rem; text-align: center; }
.memory-route ol[b-4xfo6trdyc] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .7rem; margin: 0; padding: 0; list-style: none; }
.memory-route li[b-4xfo6trdyc] { position: relative; display: grid; justify-items: center; color: #716a78; }
.memory-route li:not(:last-child)[b-4xfo6trdyc]::after { content: ""; position: absolute; left: 74%; top: 16px; width: 52%; height: 1px; background: #5d4263; }
.memory-route li.complete[b-4xfo6trdyc], .memory-route li.current[b-4xfo6trdyc] { color: #c675d6; }
.memory-route li.current[b-4xfo6trdyc] { text-shadow: 0 0 10px #a94fc6; }
.memory-route li small[b-4xfo6trdyc] { margin-top: .25rem; font-size: .5rem; }
.memory-route li b[b-4xfo6trdyc] { font-size: .5rem; font-weight: 500; }
.memory-route__grid[b-4xfo6trdyc] { width: 34px; height: 28px; display: grid; gap: 1px; grid-template-columns: repeat(4, 1fr); }
.memory-route__grid--3[b-4xfo6trdyc] { width: 40px; grid-template-columns: repeat(5, 1fr); }
.memory-route__grid--4[b-4xfo6trdyc] { width: 46px; grid-template-columns: repeat(6, 1fr); }
.memory-route__grid i[b-4xfo6trdyc] { border: 1px solid currentColor; background: color-mix(in srgb, currentColor 25%, transparent); }

.games-world .game-cabinet[b-4xfo6trdyc] {
    overflow: hidden;
    border: 1px solid rgba(213, 157, 74, .58);
    background: rgba(3, 10, 17, .94);
    box-shadow: 0 30px 85px #000c;
}

.memory-game[b-4xfo6trdyc] {
    position: relative;
    min-height: 0;
    padding: 1rem 1.2rem 1.25rem;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 0, rgba(100, 48, 122, .16), transparent 42%),
        linear-gradient(160deg, rgba(5, 15, 23, .98), rgba(4, 8, 15, .98));
}

.memory-controls[b-4xfo6trdyc] {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(230px, .8fr) minmax(270px, 1fr);
    align-items: center;
    gap: 1rem;
    margin-bottom: .65rem;
}

.memory-modes[b-4xfo6trdyc] { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem; }
.memory-modes button[b-4xfo6trdyc] {
    min-height: 48px;
    border: 1px solid #6c477a;
    border-radius: 5px;
    background: rgba(40, 20, 51, .8);
    color: #dcbce2;
    font-size: .67rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    cursor: pointer;
}
.memory-modes button span[b-4xfo6trdyc] { margin-right: .4rem; color: #d482ea; }
.memory-modes button.active[b-4xfo6trdyc] { border-color: #f1ae54; background: linear-gradient(135deg, #ffbd5d, #df8339); color: #160e16; box-shadow: 0 0 22px rgba(242, 157, 66, .28); }
.memory-modes button.active span[b-4xfo6trdyc] { color: #160e16; }

.memory-round-title[b-4xfo6trdyc] { text-align: center; text-transform: uppercase; }
.memory-round-title span[b-4xfo6trdyc] { display: block; color: #f0c681; font-family: var(--display); font-size: 1rem; }
.memory-round-title strong[b-4xfo6trdyc] { color: #b7aab6; font-size: .56rem; letter-spacing: .12em; }

.memory-scoreboard[b-4xfo6trdyc] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.memory-scoreboard > div[b-4xfo6trdyc] {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .45rem .75rem;
    border: 1px solid #78552f;
    border-radius: 5px;
    background: #071019;
}
.memory-scoreboard > div:only-child[b-4xfo6trdyc] { grid-column: 2; }
.memory-scoreboard > div.current[b-4xfo6trdyc] { box-shadow: inset 0 0 18px rgba(242, 169, 78, .13), 0 0 12px rgba(242, 169, 78, .16); }
.memory-scoreboard .player-two[b-4xfo6trdyc] { border-color: #734c86; }
.memory-scoreboard span[b-4xfo6trdyc] { color: #c9a66a; font-size: .55rem; letter-spacing: .08em; text-transform: uppercase; }
.memory-scoreboard .player-two span[b-4xfo6trdyc] { color: #c77ddb; }
.memory-scoreboard strong[b-4xfo6trdyc] { color: #f3b652; font-family: var(--display); font-size: 1.15rem; }
.memory-scoreboard .player-two strong[b-4xfo6trdyc] { color: #d889ed; }

.memory-feedback[b-4xfo6trdyc] {
    display: flex;
    justify-content: center;
    gap: 1.2rem;
    min-height: 24px;
    color: #a69daa;
    font-size: .6rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.memory-feedback span[b-4xfo6trdyc] { color: #e0bd83; }
.memory-feedback b[b-4xfo6trdyc] { color: #c377d3; }
.memory-feedback em[b-4xfo6trdyc] { font-style: normal; }

.memory-board[b-4xfo6trdyc] {
    display: grid;
    gap: clamp(.42rem, .8vw, .72rem);
    grid-template-columns: repeat(6, minmax(0, 1fr));
    /* Perspective staat bewust op de kaart zelf (zie .memory-card): elke kaart
       draait rond zijn eigen verticale middellijn. */
}
.memory-board--round-2[b-4xfo6trdyc] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.memory-board--round-3[b-4xfo6trdyc] { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.memory-board--round-4[b-4xfo6trdyc] { grid-template-columns: repeat(6, minmax(0, 1fr)); }

/* ── Monster Memory: één fysiek dubbelzijdig kaartobject ──────────────────────
   ROOT CAUSE van het gespiegelde beeld en de hover-afhankelijkheid, zoals die
   eerder in `.memory-card:not(:disabled):hover` zat:

   1. `filter: brightness(1.16)` — `filter` is een groeperende property. Zolang
      die actief is, negeert de browser `transform-style: preserve-3d` op de
      kaart: de faces worden plat over elkaar getekend en `backface-visibility`
      verliest zijn werking. De paarse achterkant bleef dan (gespiegeld) over de
      afbeelding heen liggen.
   2. `transform: translateY(-2px)` — dat verving de complete transform van de
      kaart, inclusief `rotateY(180deg)` van een open kaart. De kaart draaide
      dus terug zolang de muis erop stond.
   Omdat de muis na de klik nog op de kaart staat, bleef de afbeelding
   onzichtbaar tot de pointer werd bewogen (:hover viel toen weg).

   Structurele oplossing: hover gebruikt alleen de losse `translate`-property
   (raakt `transform` nooit), er is nergens een filter- of opacity-truc nodig,
   en de rotatie zit uitsluitend in `.memory-card-inner`. Beide faces staan
   altijd in de DOM; welke zijde zichtbaar is volgt puur uit 3D-geometrie plus
   backface-visibility. */
.memory-card[b-4xfo6trdyc] {
    position: relative;
    min-width: 0;
    aspect-ratio: 1.56;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    perspective: 900px;
    -webkit-perspective: 900px;
    /* De kaart zelf staat stil (flat): alleen de inner draait. */
    transform-style: flat;
    translate: 0 0;
    transition: translate .22s ease;
    -webkit-tap-highlight-color: transparent;
}
.memory-card:not(:disabled):hover[b-4xfo6trdyc] { translate: 0 -2px; }
.memory-card:not(:disabled):active[b-4xfo6trdyc] { translate: 0 -1px; }
.memory-card:focus-visible[b-4xfo6trdyc] { outline: 2px solid #ffd078; outline-offset: 3px; }

.memory-card-inner[b-4xfo6trdyc] {
    position: absolute;
    inset: 0;
    border-radius: 6px;
    transform: rotateY(0deg);
    transform-origin: center center;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transition: transform .43s cubic-bezier(.22, .61, .36, 1);
    will-change: transform;
}
.memory-card.is-revealed .memory-card-inner[b-4xfo6trdyc] { transform: rotateY(180deg); }

.memory-card-face[b-4xfo6trdyc] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    display: grid;
    place-items: center;
    border: 1px solid #8d557f;
    border-radius: 6px;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    /* De slagschaduw hoort bij de face en kantelt dus mee met het papier. */
    box-shadow: 0 10px 22px rgba(0, 0, 0, .5);
}

.memory-card-back[b-4xfo6trdyc] {
    transform: rotateY(0deg);
    background:
        radial-gradient(circle at 50% 50%, rgba(177, 82, 199, .26), transparent 32%),
        repeating-linear-gradient(45deg, rgba(123, 67, 142, .06) 0 1px, transparent 1px 8px),
        #171124;
    box-shadow: 0 10px 22px rgba(0, 0, 0, .5), inset 0 0 0 4px #080c14, inset 0 0 0 5px #6f426e, inset 0 0 22px #000;
}
.memory-card-back[b-4xfo6trdyc]::before,
.memory-card-back[b-4xfo6trdyc]::after { content: ""; position: absolute; width: 22px; height: 22px; border-color: #9c658e; opacity: .72; }
.memory-card-back[b-4xfo6trdyc]::before { left: 8px; top: 8px; border-left: 1px solid; border-top: 1px solid; }
.memory-card-back[b-4xfo6trdyc]::after { right: 8px; bottom: 8px; border-right: 1px solid; border-bottom: 1px solid; }
.memory-card-back b[b-4xfo6trdyc] { color: #c66cdb; font-family: var(--display); font-size: clamp(1.15rem, 2.4vw, 2rem); text-shadow: 0 0 15px #c153da; }
.memory-card-back i[b-4xfo6trdyc] { position: absolute; inset: 22%; border: 1px solid rgba(150, 85, 166, .38); transform: rotate(45deg); }
.memory-card-back em[b-4xfo6trdyc] { position: absolute; width: 60%; height: 1px; background: linear-gradient(90deg, transparent, #9b5fa1, transparent); }

.memory-card-front[b-4xfo6trdyc] {
    transform: rotateY(180deg);
    border-color: #bc7d45;
    background: #0b1118;
    box-shadow: 0 10px 22px rgba(0, 0, 0, .5), inset 0 0 0 3px #080b10, inset 0 0 0 4px #684226;
}
.memory-card-image[b-4xfo6trdyc] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    filter: saturate(.9) contrast(1.04) brightness(.82);
}
.memory-card-front[b-4xfo6trdyc]::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(3, 5, 8, .92)); }
.memory-card-front strong[b-4xfo6trdyc] { position: absolute; z-index: 2; left: .4rem; right: .4rem; bottom: .3rem; margin: 0; color: #f3d8aa; font-family: var(--display); font-size: clamp(.48rem, .78vw, .7rem); line-height: 1; text-shadow: 0 2px 3px #000; }
.memory-card.is-matched .memory-card-front[b-4xfo6trdyc] {
    border-color: #f2b04e;
    box-shadow: 0 10px 22px rgba(0, 0, 0, .5), inset 0 0 0 3px #080b10, inset 0 0 0 4px #bc7d45, 0 0 24px rgba(232, 157, 61, .45);
}
/* Matched-effect via de losse properties scale/translate op de kaart: de
   rotateY van de inner blijft daarmee ongemoeid. */
.memory-card.is-matched[b-4xfo6trdyc] { animation: memory-match-b-4xfo6trdyc .75s ease; }

.memory-win[b-4xfo6trdyc] {
    position: absolute;
    z-index: 5;
    inset: 50% auto auto 50%;
    width: min(520px, calc(100% - 2rem));
    transform: translate(-50%, -50%);
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 1rem;
    padding: 1.4rem;
    border: 1px solid #d69a4c;
    background: rgba(6, 12, 20, .96);
    box-shadow: 0 25px 75px #000, 0 0 45px rgba(166, 78, 185, .28);
    text-align: left;
}
.memory-win__flare[b-4xfo6trdyc] { position: absolute; inset: -35%; z-index: -1; background: radial-gradient(circle, rgba(169, 83, 190, .25), transparent 55%); pointer-events: none; }
.memory-win small[b-4xfo6trdyc] { display: block; color: #c77bd7; font-size: .6rem; letter-spacing: .15em; text-transform: uppercase; }
.memory-win strong[b-4xfo6trdyc] { display: block; margin: .25rem 0; color: #f2d6aa; font-family: var(--display); font-size: 1.2rem; }
.memory-win p[b-4xfo6trdyc] { margin: 0; color: #aaa0a8; font-size: .78rem; }

.games-world .game-cabinet > footer[b-4xfo6trdyc] { background: rgba(4, 10, 16, .94); }
.games-world .score-save[b-4xfo6trdyc] { border-color: #b9783f; color: #ffc976; background: rgba(84, 43, 29, .22); }

/* Geen filter in deze animatie: dat zou de 3D-context van de open kaart plat
   leggen en de afbeelding tijdens de match-gloed laten wegvallen. */
@keyframes memory-match-b-4xfo6trdyc {
    0%, 100% { scale: 1; translate: 0 -2px; }
    45% { scale: 1.055; translate: 0 -5px; }
}

@media (max-width: 980px) {
    .game-tabs .game-choice[b-4xfo6trdyc] { grid-template-columns: 32% 1fr; min-height: 126px; }
    .memory-masthead[b-4xfo6trdyc] { grid-template-columns: auto 1fr; }
    .memory-route[b-4xfo6trdyc] { grid-column: 1 / -1; border: 0; border-top: 1px solid rgba(207, 151, 71, .2); padding: .65rem 0 0; }
    .memory-controls[b-4xfo6trdyc] { grid-template-columns: 1fr 1fr; }
    .memory-round-title[b-4xfo6trdyc] { grid-row: 2; grid-column: 1 / -1; }
    .memory-board[b-4xfo6trdyc],
    .memory-board--round-2[b-4xfo6trdyc],
    .memory-board--round-4[b-4xfo6trdyc] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .memory-card[b-4xfo6trdyc] { perspective: 780px; }
}

@media (max-width: 720px) {
    .games-world[b-4xfo6trdyc] { background-attachment: scroll; background-position: 52% top; }
    .games-landing[b-4xfo6trdyc] { width: min(100% - 1rem, 620px); padding-top: 6.2rem; }
    .games-landing__copy p br[b-4xfo6trdyc] { display: none; }
    .games-landing__kicker[b-4xfo6trdyc] { gap: .4rem; font-size: .54rem; letter-spacing: .18em; }
    .game-tabs[b-4xfo6trdyc] { grid-template-columns: 1fr; gap: .5rem; }
    .game-tabs .game-choice[b-4xfo6trdyc] { min-height: 104px; grid-template-columns: 29% 1fr; }
    .game-choice__copy small[b-4xfo6trdyc] { margin: .25rem 0 .4rem; }
    .games-session[b-4xfo6trdyc] { width: 100%; justify-content: space-between; gap: .75rem; }
    .games-session span[b-4xfo6trdyc], .games-session a[b-4xfo6trdyc] { display: grid; gap: 0; text-align: left; }
    .games-page.section-pad[b-4xfo6trdyc] { width: min(100% - 1rem, 620px); }
    .memory-masthead[b-4xfo6trdyc] { padding: .75rem; grid-template-columns: auto 1fr; }
    .memory-emblem[b-4xfo6trdyc] { width: 54px; height: 54px; font-size: 1.45rem; }
    .memory-route ol[b-4xfo6trdyc] { gap: .25rem; }
    .memory-route li:not(:last-child)[b-4xfo6trdyc]::after { display: none; }
    .memory-controls[b-4xfo6trdyc] { grid-template-columns: 1fr; }
    .memory-round-title[b-4xfo6trdyc] { grid-row: auto; grid-column: auto; }
    .memory-scoreboard[b-4xfo6trdyc] { grid-template-columns: repeat(2, 1fr); }
    .memory-scoreboard > div:only-child[b-4xfo6trdyc] { grid-column: 1 / -1; }
    .memory-feedback[b-4xfo6trdyc] { flex-wrap: wrap; gap: .35rem 1rem; }
    .memory-game[b-4xfo6trdyc] { padding: .7rem; }
    .memory-board[b-4xfo6trdyc],
    .memory-board--round-2[b-4xfo6trdyc],
    .memory-board--round-3[b-4xfo6trdyc],
    .memory-board--round-4[b-4xfo6trdyc] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .memory-card[b-4xfo6trdyc] { aspect-ratio: 1.28; perspective: 680px; }
    .memory-card-front strong[b-4xfo6trdyc] { font-size: .45rem; }
    .memory-win[b-4xfo6trdyc] { grid-template-columns: 1fr; text-align: center; }
}

@media (max-width: 390px) {
    .games-landing__copy h1[b-4xfo6trdyc] { font-size: 2.55rem; }
    .games-session[b-4xfo6trdyc] { display: grid; }
    .memory-route li b[b-4xfo6trdyc] { display: none; }
    .memory-route__grid[b-4xfo6trdyc] { transform: scale(.82); }
    .memory-card[b-4xfo6trdyc] { border-radius: 4px; }
}

@media (prefers-reduced-motion: reduce) {
    .game-tabs .game-choice[b-4xfo6trdyc] { transition: none; }
    /* Dezelfde fysieke flip, alleen veel korter (app.css zet globaal alle
       transities op .01ms; voor de kaart Flip houden we een korte beweging aan). */
    .memory-card[b-4xfo6trdyc] { transition: none; }
    .memory-card-inner[b-4xfo6trdyc] { transition-duration: .12s !important; }
    .memory-card.is-matched[b-4xfo6trdyc] { animation: none; }
}