.cc-condo-component {
    --cc-cream-1: #fffaf4;
    --cc-rose-light: #fbf3f2;
    --cc-brown-main: #695442;
    --cc-brown-soft: #8a725d;
    --cc-brown-light: #a58b74;
    --cc-shadow: rgba(83,60,38,.14);
    --cc-upper-share: 50%;
    --cc-lower-share: 50%;
    position: relative;
    width: 100vw;
    max-width: none;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 0;
    box-sizing: border-box;
}

.cc-condo-component .cc-condo-viewport {
    position: relative;
    width: 100%;
    max-width: 2000px;
    aspect-ratio: 1 / 2;
    margin: 0 auto;
    overflow: hidden;
    box-sizing: border-box;
    touch-action: pan-y;
    user-select: none;
    -webkit-user-select: none;
    overscroll-behavior: auto;
    background: transparent;
}

.cc-condo-component.cc-map-is-zoomed .cc-condo-viewport {
    touch-action: none !important;
}

.cc-condo-component .cc-condo-map {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    transform-origin: 0 0;
    transform: translate3d(0,0,0) scale(1);
    will-change: transform;
}

/*
 * v1.3.0: the upper and lower artwork are two independent zones inside one
 * scalable Condo world. JavaScript reads each image's natural dimensions and
 * updates the zone shares, so replacing artwork no longer requires manually
 * recalculating the total world aspect ratio.
 */
.cc-condo-component .cc-resident-zone,
.cc-condo-component .cc-facility-zone {
    position: absolute;
    left: 0;
    width: 100%;
    box-sizing: border-box;
}

.cc-condo-component .cc-resident-zone {
    top: 0;
    height: var(--cc-upper-share);
    z-index: 2;
}

.cc-condo-component .cc-facility-zone {
    top: calc(var(--cc-upper-share) - 2px);
    height: calc(var(--cc-lower-share) + 2px);
    z-index: 1;
}

.cc-condo-component .cc-condo-bg,
.cc-condo-component .cc-condo-frame,
.cc-condo-component .cc-condo-festival,
.cc-condo-component .cc-condo-facility {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: fill;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
}

.cc-condo-component .cc-condo-bg { z-index: 1; }
.cc-condo-component .cc-condo-frame { z-index: 3; }
.cc-condo-component .cc-condo-festival { z-index: 4; }
.cc-condo-component .cc-condo-facility { z-index: 1; }

/* ---------------------------------------------------------
 * Fixed lower-facility hotspots for lower.jpg.
 * Coordinates are local to the lower image, so replacing the upper artwork
 * never shifts these buttons. The visible labels are intentionally minimal
 * and use the new dark-green / antique-gold ChouChou palette.
 * --------------------------------------------------------- */
.cc-condo-component .cc-facility-hotspot {
    position: absolute;
    z-index: 6;
    display: block;
    margin: 0;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    outline: 0;
    background: transparent;
    cursor: pointer;
    color: #fff8e8;
    font-family: "Noto Sans SC","Microsoft YaHei",Arial,sans-serif;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
}

/* New lower.jpg: first interactive row (after the decorative terrace). */
.cc-condo-component .cc-facility-chat {
    left: 6.4%;
    top: 24.1%;
    width: 28.2%;
    height: 10.9%;
}

.cc-condo-component .cc-facility-swim {
    left: 36.8%;
    top: 24.1%;
    width: 27.0%;
    height: 10.9%;
}

.cc-condo-component .cc-facility-lounge {
    left: 65.2%;
    top: 24.1%;
    width: 28.6%;
    height: 10.9%;
}

/* Bottom facility row: piggy-bank payment room + management/support room. */
.cc-condo-component .cc-facility-payment {
    left: 6.2%;
    top: 73.0%;
    width: 18.4%;
    height: 10.2%;
}

.cc-condo-component .cc-facility-support {
    left: 25.2%;
    top: 73.0%;
    width: 24.4%;
    height: 10.2%;
}

.cc-condo-component .cc-facility-label {
    position: absolute;
    left: 6.5%;
    bottom: 6.5%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .42em;
    max-width: 88%;
    min-height: clamp(20px, 1.55vw, 30px);
    padding: .36em .90em .38em;
    box-sizing: border-box;
    border: 1px solid rgba(188,143,91,.76);
    border-radius: 999px;
    background:
        linear-gradient(180deg, rgba(255,253,247,.98) 0%, rgba(250,239,224,.97) 58%, rgba(244,226,207,.97) 100%);
    box-shadow:
        0 5px 14px rgba(104,77,50,.15),
        inset 0 1px 0 rgba(255,255,255,.96),
        inset 0 0 0 2px rgba(255,249,238,.48);
    color: #75553f;
    font-family: "Noto Serif SC","Songti SC","Microsoft YaHei",serif;
    font-size: clamp(7px, .74vw, 13px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: .025em;
    white-space: nowrap;
    pointer-events: none;
}

.cc-condo-component .cc-facility-label::before {
    content: "✦";
    display: inline-block;
    color: #ba7d72;
    font-family: Georgia, serif;
    font-size: .82em;
    line-height: 1;
    text-shadow: 0 1px 0 rgba(255,255,255,.8);
}

@media (hover:hover) and (pointer:fine) {
    .cc-condo-component .cc-facility-hotspot:hover .cc-facility-label,
    .cc-condo-component .cc-facility-hotspot:focus-visible .cc-facility-label {
        color: #6c4b38;
        border-color: rgba(190,139,84,.96);
        background:
            linear-gradient(180deg, rgba(255,254,250,.99) 0%, rgba(252,239,226,.99) 52%, rgba(247,225,213,.99) 100%);
        box-shadow:
            0 7px 18px rgba(104,77,50,.20),
            0 0 0 2px rgba(231,199,160,.22),
            inset 0 1px 0 rgba(255,255,255,.98);
        transform: translateY(-1px);
    }
}

.cc-condo-component .cc-facility-hotspot:focus-visible {
    outline: 2px solid rgba(196,145,91,.52);
    outline-offset: -3px;
    border-radius: 5%;
}

@media (max-width: 767px) {
    .cc-condo-component .cc-facility-label {
        left: 5.5%;
        bottom: 5.5%;
        min-height: 15px;
        padding: .24em .58em .26em;
        border-radius: 999px;
        font-size: clamp(5px, 1.45vw, 8px);
        gap: .32em;
    }
}

.cc-condo-component .cc-condo-room {
    position: absolute;
    z-index: 2;
    box-sizing: border-box;
    overflow: hidden;
    display: block;
    border-radius: 0;
    background: transparent;
    color: inherit;
    text-decoration: none !important;
    box-shadow: none;
    cursor: pointer;
    opacity: 1;
    transition: opacity .16s ease, filter .18s ease;

    /*
     * v1.5.0 geometry model for bg-upper-0828/front-upper0828:
     * the room shell deliberately bleeds a little underneath the stone frame.
     * The transparent front artwork remains above it and hides this overscan,
     * so tiny rounding/scaling differences cannot reveal white seams.
     */
    pointer-events: none;
    inset: auto !important;
    width: 18.85% !important;
}

.cc-condo-component.cc-floor-loading .cc-condo-room { opacity: .22; }

@media (hover:hover) and (pointer:fine) {
    .cc-condo-component .cc-condo-room:hover {
        filter: brightness(1.035) saturate(1.03);
    }
}

/*
 * v1.5.1 — release calibration for the 0828 artwork pair.
 *
 * Columns use one shared step. Rows keep four explicit top/height values because
 * the photographed masonry is not perfectly identical from top to bottom.
 * Each room is intentionally ~0.35% wider/taller on each edge than the old
 * visible opening; front-upper.png masks the extra pixels.
 */
.cc-condo-component .cc-condo-room.c1 { left: 7.35% !important; }
.cc-condo-component .cc-condo-room.c2 { left: 29.55% !important; }
.cc-condo-component .cc-condo-room.c3 { left: 51.75% !important; }
.cc-condo-component .cc-condo-room.c4 { left: 73.95% !important; }

.cc-condo-component .cc-condo-room.r1 { top: 32.55% !important; height: 14.48% !important; }
.cc-condo-component .cc-condo-room.r2 { top: 48.92% !important; height: 14.78% !important; }
.cc-condo-component .cc-condo-room.r3 { top: 65.48% !important; height: 15.08% !important; }
.cc-condo-component .cc-condo-room.r4 { top: 82.05% !important; height: 15.38% !important; }

/* Featured media is the bleed layer. It may safely disappear under masonry. */
.cc-condo-component .cc-room-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 69%;
    overflow: hidden;
    background: linear-gradient(145deg, var(--cc-cream-1), var(--cc-rose-light));
    pointer-events: none;
}

.cc-condo-component .cc-room-cover-img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}

.cc-condo-component .cc-room-cover-empty {
    width: 100%;
    height: 100%;
    background: linear-gradient(145deg, #fffaf5 0%, #f5e9de 55%, #f2e3df 100%);
}

.cc-condo-component .cc-room-crown {
    position: absolute;
    top: 5%;
    right: 4%;
    z-index: 5;
    width: clamp(14px,1.7vw,30px);
    aspect-ratio: 1/1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(145deg,rgba(230,197,129,.96),rgba(194,151,84,.96));
    border: 1px solid rgba(255,255,255,.8);
    color: #fff8eb;
    font-family: Georgia,serif;
    font-size: clamp(9px,1vw,18px);
    line-height: 1;
    box-shadow: 0 2px 8px rgba(111,82,41,.22);
}

/*
 * Footer background is still allowed to bleed under the lower flower/stone
 * beam. The actual avatar/name/title live in .cc-room-footer-safe above it.
 */
.cc-condo-component .cc-room-footer {
    position: absolute;
    left: 0;
    right: 0;
    top: 66.5%;
    bottom: 0;
    box-sizing: border-box;
    background: linear-gradient(180deg,rgba(255,251,246,.985),rgba(245,235,225,.985));
    border-top: 0;
    pointer-events: none;
}

.cc-condo-component .cc-room-footer-safe {
    position: absolute;
    left: 5.0%;
    right: 5.2%;
    top: 5%;
    height: 66%;
    min-width: 0;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 4%;
    pointer-events: none;
}

.cc-condo-component .cc-room-avatar-box {
    height: 100%;
    max-height: 100%;
    aspect-ratio: 1/1;
    flex: 0 0 auto;
    overflow: hidden;
    border-radius: 50%;
    background: #fffdf8;
    border: 1px solid rgba(212,185,146,.42);
    box-shadow: 0 1px 5px rgba(96,71,47,.10);
}

.cc-condo-component .cc-room-avatar {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.cc-condo-component .cc-room-text {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4%;
}

.cc-condo-component .cc-room-author {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--cc-brown-light);
    font-family: "Noto Sans SC","Microsoft YaHei",Arial,sans-serif;
    font-size: clamp(5px,.58vw,11px);
    font-weight: 700;
    line-height: 1.1;
}

.cc-condo-component .cc-room-title {
    width: 100%;
    overflow: hidden;
    color: var(--cc-brown-main);
    font-family: "Noto Sans SC","Microsoft YaHei",Arial,sans-serif;
    font-size: clamp(6px,.76vw,15px);
    font-weight: 800;
    line-height: 1.18;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/*
 * Only the safe interior receives clicks. The oversized bleed shell itself is
 * non-interactive, preventing an invisible room from stealing clicks through a
 * stone column even though the frame PNG intentionally uses pointer-events:none.
 */
.cc-condo-component .cc-room-hitbox {
    position: absolute;
    z-index: 8;
    left: 2.5%;
    right: 2.5%;
    top: 2.5%;
    bottom: 5.5%;
    display: block;
    pointer-events: auto;
    cursor: pointer;
    background: transparent;
}

/* Internal calibration overlay: admin only, enabled by ?cc_condo_debug=1. */
.cc-condo-component.cc-condo-debug .cc-condo-room {
    overflow: visible;
    outline: 2px dashed rgba(220,45,45,.92);
    outline-offset: -2px;
}

.cc-condo-component.cc-condo-debug .cc-room-footer-safe {
    outline: 2px solid rgba(29,164,91,.95);
    background: rgba(29,164,91,.08);
}

.cc-condo-component.cc-condo-debug .cc-room-hitbox {
    outline: 2px dotted rgba(30,105,220,.95);
    background: rgba(30,105,220,.06);
}

.cc-condo-component.cc-condo-debug .cc-condo-room::after {
    content: "ROOM " attr(data-slot);
    position: absolute;
    z-index: 20;
    top: 3px;
    left: 4px;
    padding: 2px 5px;
    border-radius: 4px;
    background: rgba(130,0,0,.86);
    color: #fff;
    font: 700 10px/1.2 Arial,sans-serif;
    letter-spacing: .02em;
    pointer-events: none;
}

/*
 * Google-Maps-style floor controller.
 * It is a sibling of .cc-condo-map, so zoom/pan never scales or moves it.
 * PC and mobile intentionally use the same compact vertical layout.
 */
.cc-floor-elevator {
    position: absolute;
    left: clamp(16px, 1.15vw, 22px);
    top: 25.293957%;
    z-index: 30;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 0;
    width: clamp(32px, 2.25vw, 40px);
    padding: 3px;
    box-sizing: border-box;
    border: 1px solid rgba(205,173,126,.62);
    border-radius: 11px;
    background: rgba(255,249,240,.94);
    box-shadow: 0 4px 15px rgba(76,55,34,.16);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    pointer-events: auto;
    font-family: "Noto Sans SC","Microsoft YaHei",Arial,sans-serif;
}

.cc-floor-numbers {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
}

.cc-floor-button,
.cc-floor-arrow {
    appearance: none;
    -webkit-appearance: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    height: clamp(25px, 2vw, 30px);
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid rgba(205,173,126,.24);
    border-radius: 0;
    background: transparent;
    color: #80684e;
    font-size: clamp(8px, .72vw, 11px);
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.cc-floor-arrow {
    color: #ae8951;
    font-size: clamp(9px, .82vw, 12px);
}

.cc-floor-prev {
    border-radius: 8px 8px 0 0;
}

.cc-floor-next {
    border-bottom: 0;
    border-radius: 0 0 8px 8px;
}

.cc-floor-button.is-active {
    color: #fffaf1;
    background: linear-gradient(145deg,#dabd82,#b78b4e);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
}

.cc-floor-arrow:disabled {
    opacity: .24;
    cursor: default;
}

.cc-condo-component.cc-floor-loading .cc-floor-elevator,
.cc-floor-elevator.is-loading {
    pointer-events: none;
    opacity: .72;
}

.cc-floor-status {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
}

@media (max-width: 767px) {
    .cc-condo-component .cc-room-footer-safe {
        left: 4.5%;
        right: 5%;
        top: 7%;
        height: 62%;
        gap: 3%;
    }

    .cc-condo-component .cc-room-avatar-box { height: 100%; }
    .cc-condo-component .cc-room-author { font-size: clamp(3px,1vw,6px); }

    .cc-condo-component .cc-room-title {
        font-size: clamp(3px,1.15vw,7px);
        line-height: 1.1;
    }

    .cc-condo-component .cc-room-crown {
        width: clamp(8px,3vw,14px);
        font-size: clamp(5px,1.8vw,9px);
        top: 4%;
        right: 4%;
    }

    .cc-floor-elevator {
        left: max(12px, calc(env(safe-area-inset-left) + 8px));
        width: 34px;
        padding: 2px;
        border-radius: 9px;
    }

    .cc-floor-button,
    .cc-floor-arrow {
        height: 25px;
        font-size: 8px;
    }

    .cc-floor-arrow { font-size: 9px; }
}


/*
 * Mobile browsing mode: at 1x the Condo is a normal tall document, so a
 * single finger scrolls the page all the way to the lobby. Only after a real
 * pinch zoom do we switch to map-drag mode. This avoids the lower building
 * being trapped inside an overflow-clipped viewport on phones.
 */
@media (max-width: 767px) {
    .cc-condo-component .cc-condo-viewport {
        overflow: visible;
        touch-action: pan-y !important;
        overscroll-behavior: auto !important;
    }

    .cc-condo-component.cc-map-is-zoomed .cc-condo-viewport {
        overflow: hidden;
        touch-action: none !important;
    }
}


/* Fixed payment panel opened from the piggy-bank room. */
.cc-facility-payment-modal[hidden] { display: none !important; }

.cc-facility-payment-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483200 !important;
    display: none !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 14px !important;
    box-sizing: border-box;
    transform: none !important;
    zoom: 1 !important;
}

.cc-facility-payment-modal.is-open { display: flex !important; }

.cc-facility-payment-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(29,23,32,.62);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.cc-facility-payment-dialog {
    position: relative;
    z-index: 2;
    width: min(1480px, calc(100vw - 28px));
    max-height: calc(100dvh - 28px);
    overflow: auto;
    box-sizing: border-box;
    padding: clamp(18px, 2vw, 30px);
    border: 1px solid rgba(224,205,178,.88);
    border-radius: 22px;
    background: #fffdf9;
    box-shadow: 0 24px 80px rgba(21,15,25,.34);
    -webkit-overflow-scrolling: touch;
}

.cc-facility-payment-close {
    position: sticky;
    top: 0;
    float: right;
    z-index: 10;
    width: 40px;
    height: 40px;
    margin: 0 0 8px 12px;
    padding: 0 0 2px;
    border: 1px solid rgba(205,173,126,.62);
    border-radius: 50%;
    background: rgba(255,250,242,.96);
    color: #745844;
    font: 300 25px/1 Arial,sans-serif;
    cursor: pointer;
}

.cc-facility-payment-body {
    clear: both;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.cc-facility-payment-body > * { max-width: 100%; }
.cc-facility-empty { padding: 28px; text-align: center; color: #765d48; }

@media (max-width: 767px) {
    .cc-facility-payment-modal { padding: 6px !important; }
    .cc-facility-payment-dialog {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
        padding: 12px;
        border-radius: 14px;
    }
    .cc-facility-payment-close { width: 36px; height: 36px; font-size: 22px; }
}

/* Modal is moved under body by JS, so these selectors intentionally do not depend on .cc-condo-component. */
.cc-post-modal[hidden] { display: none !important; }

.cc-post-modal {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 2147483000 !important;
    display: none !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 4vh 3vw;
    margin: 0 !important;
    transform: none !important;
    zoom: 1 !important;
    opacity: 1 !important;
    visibility: visible !important;
    isolation: isolate;
}

.cc-post-modal.is-open { display: flex !important; }

.cc-post-modal .cc-post-modal-backdrop {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(29,23,32,.62);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.cc-post-modal .cc-post-modal-dialog {
    position: relative;
    z-index: 2;
    width: min(1400px,94vw);
    max-width: 1400px;
    height: 90vh;
    max-height: 90vh;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: 24px;
    background: #fffdf9;
    border: 1px solid rgba(224,205,178,.85);
    box-shadow: 0 24px 80px rgba(21,15,25,.34);
    transform: none !important;
    zoom: 1 !important;
}

/* Dedicated in-world Chat Room modal: slightly wider/taller, same close behavior. */
.cc-post-modal.cc-chatroom-modal .cc-post-modal-dialog {
    width: min(1540px,96vw);
    max-width: 1540px;
    height: 92vh;
    max-height: 92vh;
    border-color: rgba(224,205,178,.72);
    background: #17110f;
}

.cc-post-modal.cc-chatroom-modal .cc-reader-loading {
    background:
        linear-gradient(rgba(34,24,20,.28), rgba(34,24,20,.28)),
        url('https://1000princes.com/wp-content/uploads/2026/08/92922bc6-b467-44a5-9a33-b72bbe9ba053.png') center/cover no-repeat;
    color: #fffaf2;
    text-shadow: 0 1px 3px rgba(0,0,0,.45);
}

.cc-post-modal .cc-post-reader-frame {
    position: absolute;
    inset: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    background: #fffdf9;
}

.cc-post-modal .cc-post-modal-close {
    position: absolute !important;
    top: 14px !important;
    right: 16px !important;
    z-index: 1000 !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(190,160,120,.32) !important;
    border-radius: 50% !important;
    background: rgba(255,252,247,.96) !important;
    color: #715c4b !important;
    font-family: Arial,sans-serif !important;
    font-size: 30px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    box-shadow: 0 4px 14px rgba(70,50,36,.14);
}

.cc-post-modal .cc-reader-loading {
    position: absolute;
    inset: 0;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    background: #fffdf9;
    color: #8d7867;
    transition: opacity .2s ease;
}

.cc-post-modal .cc-reader-loading.is-hidden {
    opacity: 0;
    pointer-events: none;
}

.cc-post-modal .cc-reader-loading-ring {
    width: 34px;
    height: 34px;
    box-sizing: border-box;
    border-radius: 50%;
    border: 3px solid #eadfce;
    border-top-color: #b99665;
    animation: ccCondoReaderSpin .8s linear infinite;
}

@keyframes ccCondoReaderSpin {
    to { transform: rotate(360deg); }
}

@media (max-width: 767px) {
    .cc-post-modal {
        padding: 0 !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        background: #fffdf9;
    }

    .cc-post-modal .cc-post-modal-dialog {
        width: 100% !important;
        max-width: none !important;
        height: 100vh;
        height: 100dvh;
        max-height: none !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .cc-post-modal .cc-post-modal-backdrop {
        background: #fffdf9;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .cc-post-modal .cc-post-modal-close {
        position: fixed !important;
        top: max(10px,env(safe-area-inset-top)) !important;
        right: 12px !important;
        width: 44px !important;
        height: 44px !important;
        z-index: 2147483646 !important;
        font-size: 28px !important;
    }
}

/* =============================================================
 * Fixed player room — row 3 / column 3
 * Uses a real <img> for the configured room picture. This is more reliable
 * than a CSS background and makes saved admin images immediately visible.
 * ============================================================= */
.cc-condo-component .cc-player-room-media,
.cc-condo-component .cc-player-room-cover {
    width: 100%;
    height: 100%;
}

.cc-condo-component .cc-player-room-media {
    overflow: hidden;
}

.cc-condo-component .cc-player-room-image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}

.cc-condo-component .cc-player-room-cover {
    background:
        radial-gradient(circle at 70% 25%, rgba(255,255,255,.72), transparent 36%),
        linear-gradient(145deg, #fff8f1 0%, #f4e7df 52%, #eadfd8 100%);
}

.cc-condo-component .cc-player-avatar-fallback {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #b89270;
    font-family: Georgia, serif;
    font-size: clamp(9px,1vw,18px);
    line-height: 1;
}