@import url(board.css);

/* Screen-reader only: keeps semantic headings accessible without visual duplication. */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* --------------------------------------------------------------------------
 * 1단계 메뉴 그룹 타이틀 / Breadcrumb
 * -------------------------------------------------------------------------- */
.site-group-header {
    position: relative;
    overflow: hidden;
    width: 100%;
    color: #172033;
    background: transparent;
}

.site-group-header[hidden] {
    display: none !important;
}

.site-group-header__background {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.site-group-header__inner {
    position: relative;
    z-index: 2;
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
}

.site-group-header__text {
    min-height: 170px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 38px 0 32px;
}

.site-group-header__text h1,
.site-group-header__text h2,
.site-group-header__text h3,
.site-group-header__text h4 {
    margin: 0 0 10px;
    line-height: 1.2;
    letter-spacing: -.035em;
}

.site-group-header__text p {
    margin: 0;
    line-height: 1.7;
}

.site-group-header__text a {
    color: inherit;
}

.site-group-breadcrumb-wrap {
    position: relative;
    z-index: 2;
    border-top: 1px solid rgba(16, 24, 40, .08);
    background: rgba(255, 255, 255, .72);
    backdrop-filter: blur(8px);
}

.site-group-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    min-height: 48px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 12px;
}

.site-group-breadcrumb__item {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    color: #667085;
}

.site-group-breadcrumb__item a {
    color: #475467;
    text-decoration: none;
}

.site-group-breadcrumb__item a:hover {
    color: #155eef;
}

.site-group-breadcrumb__item.is-active {
    color: #101828;
    font-weight: 700;
}


.site-group-breadcrumb--slash .site-group-breadcrumb__item + .site-group-breadcrumb__item::before {
    content: "/";
    padding: 0 8px;
    color: #d0d5dd;
}

.site-group-breadcrumb--arrow .site-group-breadcrumb__item + .site-group-breadcrumb__item::before {
    content: "›";
    padding: 0 9px;
    color: #98a2b3;
    font-size: 17px;
    line-height: 1;
}

.site-group-breadcrumb--pill {
    gap: 7px;
    padding: 8px 0;
}

.site-group-breadcrumb--pill .site-group-breadcrumb__item {
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid #e4e7ec;
    border-radius: 999px;
    background: rgba(255, 255, 255, .88);
}

.site-group-breadcrumb--pill .site-group-breadcrumb__item.is-active {
    border-color: #b2ccff;
    background: #eff4ff;
    color: #155eef;
}

@media (max-width: 768px) {
    .site-group-header__inner {
        width: min(100% - 28px, 1180px);
    }

    .site-group-header__text {
        min-height: 140px;
        padding: 28px 0 24px;
    }

    .site-group-breadcrumb {
        min-height: 44px;
        font-size: 11px;
    }
}

.site-group-submenu-wrap {
    position: relative;
    z-index: 2;
    border-top: 1px solid rgba(16, 24, 40, .08);
    background: #fff;
}

.site-group-submenu-wrap[hidden] {
    display: none !important;
}

.site-group-submenu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 12px 0;
    list-style: none;
}

.site-group-submenu__item {
    min-width: 0;
}

.site-group-submenu__item a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    color: #475467;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
}

.site-group-submenu--tabs {
    gap: 0;
    padding-bottom: 0;
}

.site-group-submenu--tabs .site-group-submenu__item a {
    border-bottom: 2px solid transparent;
}

.site-group-submenu--tabs .site-group-submenu__item.is-active a {
    border-bottom-color: #155eef;
    color: #155eef;
}

.site-group-submenu--buttons .site-group-submenu__item a {
    border: 1px solid #d0d5dd;
    border-radius: 9px;
    background: #fff;
}

.site-group-submenu--buttons .site-group-submenu__item.is-active a {
    border-color: #155eef;
    background: #155eef;
    color: #fff;
}

.site-group-submenu--underline {
    gap: 18px;
}

.site-group-submenu--underline .site-group-submenu__item a {
    min-height: 34px;
    padding: 0 2px;
    border-bottom: 1px solid transparent;
}

.site-group-submenu--underline .site-group-submenu__item.is-active a {
    border-bottom-color: #101828;
    color: #101828;
}

.site-group-submenu--cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
}

.site-group-submenu--cards .site-group-submenu__item a {
    width: 100%;
    min-height: 54px;
    border: 1px solid #e4e7ec;
    border-radius: 10px;
    background: #f9fafb;
}

.site-group-submenu--cards .site-group-submenu__item.is-active a {
    border-color: #b2ccff;
    background: #eff4ff;
    color: #155eef;
}

@media (max-width: 768px) {
    .site-group-submenu {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding: 10px 0;
        scrollbar-width: none;
    }

    .site-group-submenu::-webkit-scrollbar {
        display: none;
    }

    .site-group-submenu--cards {
        display: flex;
    }

    .site-group-submenu--cards .site-group-submenu__item {
        flex: 0 0 170px;
    }
}

/* --------------------------------------------------------------------------
 * 그룹 하위메뉴 - 문서스타일
 * -------------------------------------------------------------------------- */
.site-group-submenu--document {
    display: block;
}

.site-group-document {
    display: grid;
    gap: 28px;
    padding: 26px 0 34px;
}

.site-group-document__loading,
.site-group-document__empty {
    padding: 28px 0;
    color: #98a2b3;
    font-size: 13px;
    text-align: center;
}

.site-group-document-page {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr);
    overflow: hidden;
    border: 1px solid #e4e7ec;
    border-radius: 16px;
    background: #fff;
    color: #172033;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.site-group-document-page:hover {
    border-color: #b2ccff;
    box-shadow: 0 14px 34px rgba(16, 24, 40, .07);
    transform: translateY(-2px);
}

.site-group-document-page.is-no-image {
    grid-template-columns: 1fr;
}

.site-group-document-page__media {
    min-height: 220px;
    background: #f2f4f7;
}

.site-group-document-page__media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 220px;
    object-fit: cover;
}

.site-group-document-page__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 28px;
}

.site-group-document-page__body h3,
.site-group-document-board__head h3 {
    margin: 0;
    color: #101828;
    font-size: 20px;
    letter-spacing: -.03em;
}

.site-group-document-page__body p {
    margin: 12px 0 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.75;
}

.site-group-document__more {
    display: inline-flex;
    align-items: center;
    margin-top: 18px;
    color: #155eef;
    font-size: 12px;
    font-weight: 800;
}

.site-group-document-board {
    min-width: 0;
}

.site-group-document-board__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.site-group-document-board__head a {
    flex: 0 0 auto;
    color: #155eef;
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
}

.site-group-document-list {
    border-top: 1px solid #e4e7ec;
}

.site-group-document-list__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 16px 2px;
    border-bottom: 1px solid #eaecf0;
    color: #172033;
    text-decoration: none;
}

.site-group-document-list__item > div {
    min-width: 0;
}

.site-group-document-list__item strong {
    display: block;
    overflow: hidden;
    color: #101828;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.site-group-document-list__item p {
    display: -webkit-box;
    overflow: hidden;
    margin: 6px 0 0;
    color: #667085;
    font-size: 12px;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.site-group-document-list__item small {
    flex: 0 0 auto;
    color: #98a2b3;
    font-size: 11px;
}

.site-group-document-gallery {
    display: grid;
    grid-template-columns:
        repeat(
            var(--group-document-columns, 4),
            minmax(0, 1fr)
        );
    gap: 14px;
}

.site-group-document-gallery__item {
    display: block;
    min-width: 0;
    color: #172033;
    text-decoration: none;
}

.site-group-document-gallery__media {
    display: grid;
    width: 100%;
    aspect-ratio: 4 / 3;
    place-items: center;
    overflow: hidden;
    border-radius: 12px;
    background: #f2f4f7;
    color: #98a2b3;
}

.site-group-document-gallery__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .2s ease;
}

.site-group-document-gallery__item:hover
.site-group-document-gallery__media img {
    transform: scale(1.025);
}

.site-group-document-gallery__media
.material-symbols-rounded {
    font-size: 36px;
}

.site-group-document-gallery__item strong {
    display: -webkit-box;
    overflow: hidden;
    margin-top: 10px;
    color: #101828;
    font-size: 13px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.site-group-document-gallery__item small {
    display: block;
    margin-top: 5px;
    color: #98a2b3;
    font-size: 10px;
}

@media (max-width: 900px) {
    .site-group-document-gallery {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .site-group-document {
        gap: 24px;
        padding: 20px 0 28px;
    }

    .site-group-document-page {
        grid-template-columns: 1fr;
    }

    .site-group-document-page__media,
    .site-group-document-page__media img {
        min-height: 190px;
    }

    .site-group-document-page__body {
        padding: 20px;
    }

    .site-group-document-list__item {
        align-items: flex-start;
    }

    .site-group-document-gallery {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 12px;
    }
}

@media (max-width: 460px) {
    .site-group-document-gallery {
        grid-template-columns: 1fr;
    }
}

/* --------------------------------------------------------------------------
 * 관리자 메뉴 설정과 연결된 사용자 page / board 공통 렌더러
 * -------------------------------------------------------------------------- */
.site-page-content,
.site-board,
.site-board-post,
.site-content-state,
.site-monthly-board {
    width: 100%;
    margin: 0 auto;
}

.site-page-content,
.site-monthly-board {
    padding: 0 0 72px;
}

.site-page-content__head,
.site-monthly-board__head {
    margin-bottom: 28px;
}

.site-page-content__head h1,
.site-board__head h1,
.site-board-post__head h1,
.site-monthly-board__head h1 {
    margin: 0;
    color: #101828;
    font-size: clamp(28px, 4vw, 42px);
    line-height: 1.2;
    letter-spacing: -.045em;
}

.site-page-content__body {
    min-width: 0;
    color: #344054;
    font-size: 15px;
    line-height: 1.8;
}

.site-page-content__body img,
.site-board-post__content img {
    max-width: 100%;
    height: auto;
}

.site-content-state {
    padding: 70px 0;
    color: #667085;
    text-align: center;
}

.site-content-state h2 {
    margin: 0 0 10px;
    color: #101828;
}

.site-content-state p {
    margin: 0;
}

.site-board {
    padding: 54px 0 72px;
}

.site-board__head {
    display: block;
    margin-bottom: 30px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e5e7e2;
}

.site-board__eyebrow {
    display: block;
    margin-bottom: 9px;
    color: #a18760;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .14em;
    line-height: 1.4;
    text-transform: uppercase;
}

.site-board__title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 10px 14px;
}

.site-board__count {
    display: block;
    color: #98a2b3;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    margin-bottom: 8px;
}

.site-board__description {
    max-width: 780px;
    margin: 14px 0 0;
    color: #68736c;
    font-size: 14px;
    line-height: 1.8;
    word-break: keep-all;
}

.site-board-list {
    border-top: 1px solid #dfe3e8;
}

.site-board-list__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 18px 4px;
    border-bottom: 1px solid #eaecf0;
    color: #172033;
    text-decoration: none;
}

.site-board-list__item > div {
    min-width: 0;
}

.site-board-list__item strong {
    display: block;
    overflow: hidden;
    color: #101828;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.site-board-list__item p {
    display: -webkit-box;
    overflow: hidden;
    margin: 7px 0 0;
    color: #667085;
    font-size: 12px;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.site-board-list__item time {
    flex: 0 0 auto;
    color: #98a2b3;
    font-size: 11px;
}

.site-board-gallery {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.site-board-gallery__item {
    display: block;
    min-width: 0;
    color: #172033;
    text-decoration: none;
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    min-height: 300px;
}


.site-board-gallery__item::before {
    content: '';
    position: absolute;
    bottom: 0;
    padding: 8px;
    width: 100%;
    height: 89px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
}

.site-board-gallery__media {
    display: contents;
    overflow: hidden;
    border-radius: 12px;
    background: #f2f4f7;
    color: #98a2b3;
}

.site-board-gallery__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.site-board-gallery__media .material-symbols-rounded {
    font-size: 40px;
}

.site-board-gallery__item .site-board-gallery__body {
    display: flex;
    flex-direction: column;
    gap: 5px;
    position: absolute;
    bottom: 0;
    padding: 8px;
    width: 100%;
    background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 100%);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.site-board-gallery__item strong {
    display: -webkit-box;
    overflow: hidden;
    margin-top: 10px;
    color: #fff;
    font-size: 13px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.site-board-gallery__item small {
    display: block;
    margin-top: 5px;
    color: #fff;
    font-size: 10px;
}

.site-board-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 30px;
}

.site-board-pagination a {
    display: inline-flex;
    min-width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    border: 1px solid #d0d5dd;
    border-radius: 8px;
    background: #fff;
    color: #475467;
    text-decoration: none;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 700;
}

.site-board-pagination a[aria-current="page"] {
    border-color: #155eef;
    background: #155eef;
    color: #fff;
}

.site-board-pagination__ellipsis {
    display: inline-flex;
    width: 24px;
    height: 36px;
    align-items: center;
    justify-content: center;
    color: #98a2b3;
    font-size: 12px;
}

@media (max-width: 640px) {
    .site-board-pagination {
        gap: 5px;
        margin-top: 24px;
    }

    .site-board-pagination a {
        min-width: 34px;
        height: 34px;
        padding: 0 8px;
        border-radius: 7px;
        font-size: 11px;
    }

    .site-board-pagination__first,
    .site-board-pagination__last,
    .site-board-pagination__ellipsis,
    .site-board-pagination__number--mobile-hidden {
        display: none;
    }
}

.site-board-post {
    padding: 54px 0 72px;
}

.site-board-post__head {
    padding-bottom: 22px;
    border-bottom: 1px solid #e4e7ec;
}

.site-board-post__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-top: 14px;
    color: #98a2b3;
    font-size: 11px;
}

.site-board-post__content {
    min-height: 180px;
    padding: 32px 0;
    color: #344054;
    font-size: 14px;
    line-height: 1.8;
}

.site-board-post__actions {
    padding-top: 18px;
    border-top: 1px solid #e4e7ec;
}

.site-board-post__actions a {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 0 14px;
    border: 1px solid #d0d5dd;
    border-radius: 9px;
    background: #fff;
    color: #344054;
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
}

@media (max-width: 900px) {
    .site-board-gallery {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .site-page-content,
    .site-board,
    .site-board-post,
    .site-content-state {
        width: 100%;
    }

    .site-page-content,
    .site-board,
    .site-board-post {
        padding: 0 0 54px;
    }

    .site-board-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .site-board-list__item {
        align-items: flex-start;
    }

    .site-board__head {
        margin-bottom: 24px;
        padding-bottom: 20px;
    }

    .site-board__eyebrow {
        font-size: 10px;
    }

    .site-board__description {
        margin-top: 11px;
        font-size: 13px;
        line-height: 1.75;
    }
}

@media (max-width: 460px) {
    .site-board-gallery {
        grid-template-columns: 1fr;
    }
}

/* 그룹설정 미저장 상태의 기본 샘플 퍼블리싱 */
.site-group-header.is-sample-group .site-group-header__text {
    min-height: 210px;
}
.site-group-header.is-sample-group .site-group-header__text .site-group-sample-eyebrow {
    display: inline-flex;
    margin-bottom: 12px;
    color: rgba(255,255,255,.78);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .12em;
}
.site-group-header.is-sample-group .site-group-header__text h2 {
    color: #fff;
    font-size: clamp(32px, 5vw, 52px);
}
.site-group-header.is-sample-group .site-group-header__text p {
    color: rgba(255,255,255,.82);
    font-size: 14px;
}


.site-board-review{display:grid;gap:18px}.site-board-review__item{display:grid;grid-template-columns:220px minmax(0,1fr);overflow:hidden;border:1px solid #e5e7eb;border-radius:18px;background:#fff;color:inherit;text-decoration:none}.site-board-review__media{display:grid;min-height:160px;place-items:center;overflow:hidden;background:#f4f5f7;color:#98a2b3}.site-board-review__media img{width:100%;height:100%;object-fit:cover}.site-board-review__body{padding:22px}.site-board-review__body strong{display:block;margin:7px 0 8px;font-size:19px}.site-board-review__body p{margin:0 0 12px;color:#667085;line-height:1.65}.site-board-review__body small{color:#98a2b3}.site-board-event__period{display:inline-flex;padding:5px 9px;border-radius:999px;background:#eef4ff;color:#155eef;font-size:12px;font-weight:800}@media(max-width:700px){.site-board-review__item{grid-template-columns:1fr}.site-board-review__media{aspect-ratio:16/9}}


.site-monthly-board{display:grid;gap:22px}
.site-monthly-board__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.site-monthly-board__head h1{margin:0;font-size:clamp(28px,4vw,44px)}
.site-monthly-board__head p{margin:10px 0 0;color:#667085;line-height:1.7}
.site-monthly-board__picker{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end}
.site-monthly-board__picker label{display:grid;gap:5px;color:#667085;font-size:12px;font-weight:700}
.site-monthly-board__picker select{min-width:92px;height:42px;padding:0 30px 0 12px;border:1px solid #d0d5dd;border-radius:9px;background:#fff;color:#344054}
.site-monthly-board__current{overflow:hidden;border:1px solid #e4e7ec;border-radius:16px;background:#fff}
.site-monthly-board__period{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;border-bottom:1px solid #eaecf0;background:#f9fafb}
.site-monthly-board__period strong{font-size:15px}
.site-monthly-board__period span{color:#667085;font-size:13px}
.site-monthly-board__current .site-board-post__content{padding:24px}
@media(max-width:760px){.site-monthly-board__head{align-items:stretch;flex-direction:column}.site-monthly-board__picker{width:100%}.site-monthly-board__picker label{flex:1}.site-monthly-board__picker select{width:100%}.site-monthly-board__period{align-items:flex-start;flex-direction:column}}


.site-post-share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 14px;
    padding: 18px 0;
    border-top: 1px solid #eaecf0;
}

.site-post-share__label {
    flex: 0 0 auto;
    color: #475467;
    font-size: 12px;
    font-weight: 800;
}

.site-post-share__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.site-post-share__button {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 11px;
    border: 1px solid #d0d5dd;
    border-radius: 8px;
    background: #fff;
    color: #344054;
    cursor: pointer;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
}

.site-post-share__button:hover {
    border-color: #98a2b3;
    background: #f9fafb;
}

.site-post-share__button:focus-visible {
    outline: 2px solid #155eef;
    outline-offset: 2px;
}

.site-post-share__button .material-symbols-rounded {
    font-size: 17px;
}

.site-post-share__text-icon {
    display: inline-grid;
    width: 17px;
    height: 17px;
    place-items: center;
    border-radius: 4px;
    background: #f2f4f7;
    font-size: 10px;
    font-weight: 900;
}

.no-native-share .site-post-share__button--native {
    display: none;
}

.site-monthly-board__current .site-post-share {
    margin: 0 24px;
}

@media (max-width: 600px) {
    .site-post-share {
        align-items: flex-start;
        flex-direction: column;
    }

    .site-post-share__buttons {
        width: 100%;
    }

    .site-post-share__button {
        flex: 1 1 auto;
    }

    .site-monthly-board__current .site-post-share {
        margin: 0 16px;
    }
}

/* Rich editor media blocks */
.site-board-post__content .app-editor-media-block{display:grid;gap:12px;width:100%;max-width:100%;margin:28px auto;overflow:hidden}
.site-board-post__content .app-editor-media-block[data-media-width="75"]{width:75%}.site-board-post__content .app-editor-media-block[data-media-width="50"]{width:50%}.site-board-post__content .app-editor-media-block[data-media-width="25"]{width:25%}
.site-board-post__content .app-editor-media-block[data-media-layout="two"]{grid-template-columns:repeat(2,minmax(0,1fr))}.site-board-post__content .app-editor-media-block[data-media-layout="grid"],.site-board-post__content .app-editor-media-block[data-media-layout="random"]{grid-template-columns:repeat(3,minmax(0,1fr))}.site-board-post__content .app-editor-media-block[data-media-layout="vertical"]{grid-template-columns:1fr}
.site-board-post__content .app-editor-media-block[data-media-layout="split-left"],.site-board-post__content .app-editor-media-block[data-media-layout="split-right"]{grid-template-columns:2fr 1fr}.site-board-post__content .app-editor-media-block[data-media-layout="split-left"] .app-editor-media-block__item:first-child{grid-row:1 / span 2}.site-board-post__content .app-editor-media-block[data-media-layout="split-right"] .app-editor-media-block__item:first-child{grid-column:2;grid-row:1 / span 2}
.site-board-post__content .app-editor-media-block__item{position:relative;min-width:0;overflow:hidden;border-radius:16px;background:#0f172a}.site-board-post__content .app-editor-media-block__item img,.site-board-post__content .app-editor-media-block__item iframe{display:block;width:100%;height:100%;min-height:220px;margin:0;border:0;object-fit:cover}
.site-board-post__content .app-editor-media-block[data-media-height="240"] .app-editor-media-block__item,.site-board-post__content .app-editor-media-block[data-media-height="240"] img,.site-board-post__content .app-editor-media-block[data-media-height="240"] iframe{height:240px}.site-board-post__content .app-editor-media-block[data-media-height="360"] .app-editor-media-block__item,.site-board-post__content .app-editor-media-block[data-media-height="360"] img,.site-board-post__content .app-editor-media-block[data-media-height="360"] iframe{height:360px}.site-board-post__content .app-editor-media-block[data-media-height="480"] .app-editor-media-block__item,.site-board-post__content .app-editor-media-block[data-media-height="480"] img,.site-board-post__content .app-editor-media-block[data-media-height="480"] iframe{height:480px}.site-board-post__content .app-editor-media-block[data-media-height="600"] .app-editor-media-block__item,.site-board-post__content .app-editor-media-block[data-media-height="600"] img,.site-board-post__content .app-editor-media-block[data-media-height="600"] iframe{height:600px}
.site-board-post__content .app-editor-media-block[data-media-layout="slider"]{display:block;position:relative}.site-board-post__content .app-editor-media-block[data-media-layout="slider"] .app-editor-media-block__item{display:none}.site-board-post__content .app-editor-media-block[data-media-layout="slider"] .app-editor-media-block__item.is-active{display:block}.site-board-post__content .app-editor-media-block[data-media-effect="fade"] .is-active{animation:editorMediaFade .45s ease}.site-board-post__content .app-editor-media-block[data-media-effect="slide-left"] .is-active{animation:editorMediaSlideLeft .45s ease}.site-board-post__content .app-editor-media-block[data-media-effect="slide-up"] .is-active{animation:editorMediaSlideUp .45s ease}

.site-board-post__content .app-editor-media-block[data-media-layout="slider"]{isolation:isolate}
.site-board-post__content .app-editor-media-slider-ui{position:absolute;z-index:4;left:12px;right:12px;bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:none}
.site-board-post__content .app-editor-media-slider-prev,.site-board-post__content .app-editor-media-slider-next{display:flex;width:38px;height:38px;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.45);border-radius:999px;background:rgba(15,23,42,.62);color:#fff;font:600 26px/1 Arial,sans-serif;cursor:pointer;backdrop-filter:blur(6px);pointer-events:auto}
.site-board-post__content .app-editor-media-slider-dots{display:flex;align-items:center;justify-content:center;gap:7px;padding:7px 10px;border-radius:999px;background:rgba(15,23,42,.5);backdrop-filter:blur(6px);pointer-events:auto}
.site-board-post__content .app-editor-media-slider-dot{width:7px;height:7px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.48);cursor:pointer;transition:width .2s ease,background-color .2s ease}
.site-board-post__content .app-editor-media-slider-dot.is-active{width:20px;background:#fff}
@keyframes editorMediaFade{from{opacity:0}to{opacity:1}}@keyframes editorMediaSlideLeft{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}@keyframes editorMediaSlideUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@media (max-width:760px){.site-board-post__content .app-editor-media-block[data-media-width]{width:100%}.site-board-post__content .app-editor-media-block[data-media-layout="grid"],.site-board-post__content .app-editor-media-block[data-media-layout="random"]{grid-template-columns:repeat(2,minmax(0,1fr))}.site-board-post__content .app-editor-media-block[data-media-layout="split-left"],.site-board-post__content .app-editor-media-block[data-media-layout="split-right"]{grid-template-columns:1fr}.site-board-post__content .app-editor-media-block[data-media-layout="split-left"] .app-editor-media-block__item:first-child,.site-board-post__content .app-editor-media-block[data-media-layout="split-right"] .app-editor-media-block__item:first-child{grid-column:auto;grid-row:auto}}



/* Rich editor media blocks */
.op-board-content .app-editor-media-block{display:grid;gap:12px;width:100%;max-width:100%;margin:28px auto;overflow:hidden}
.op-board-content .app-editor-media-block[data-media-width="75"]{width:75%}.op-board-content .app-editor-media-block[data-media-width="50"]{width:50%}.op-board-content .app-editor-media-block[data-media-width="25"]{width:25%}
.op-board-content .app-editor-media-block[data-media-layout="two"]{grid-template-columns:repeat(2,minmax(0,1fr))}.op-board-content .app-editor-media-block[data-media-layout="grid"],.op-board-content .app-editor-media-block[data-media-layout="random"]{grid-template-columns:repeat(3,minmax(0,1fr))}.op-board-content .app-editor-media-block[data-media-layout="vertical"]{grid-template-columns:1fr}
.op-board-content .app-editor-media-block[data-media-layout="split-left"],.op-board-content .app-editor-media-block[data-media-layout="split-right"]{grid-template-columns:2fr 1fr}.op-board-content .app-editor-media-block[data-media-layout="split-left"] .app-editor-media-block__item:first-child{grid-row:1 / span 2}.op-board-content .app-editor-media-block[data-media-layout="split-right"] .app-editor-media-block__item:first-child{grid-column:2;grid-row:1 / span 2}
.op-board-content .app-editor-media-block__item{position:relative;min-width:0;overflow:hidden;border-radius:16px;background:#0f172a}.op-board-content .app-editor-media-block__item img,.op-board-content .app-editor-media-block__item iframe{display:block;width:100%;height:100%;min-height:220px;margin:0;border:0;object-fit:cover}
.op-board-content .app-editor-media-block[data-media-height="240"] .app-editor-media-block__item,.op-board-content .app-editor-media-block[data-media-height="240"] img,.op-board-content .app-editor-media-block[data-media-height="240"] iframe{height:240px}.op-board-content .app-editor-media-block[data-media-height="360"] .app-editor-media-block__item,.op-board-content .app-editor-media-block[data-media-height="360"] img,.op-board-content .app-editor-media-block[data-media-height="360"] iframe{height:360px}.op-board-content .app-editor-media-block[data-media-height="480"] .app-editor-media-block__item,.op-board-content .app-editor-media-block[data-media-height="480"] img,.op-board-content .app-editor-media-block[data-media-height="480"] iframe{height:480px}.op-board-content .app-editor-media-block[data-media-height="600"] .app-editor-media-block__item,.op-board-content .app-editor-media-block[data-media-height="600"] img,.op-board-content .app-editor-media-block[data-media-height="600"] iframe{height:600px}
.op-board-content .app-editor-media-block[data-media-layout="slider"]{display:block;position:relative}.op-board-content .app-editor-media-block[data-media-layout="slider"] .app-editor-media-block__item{display:none}.op-board-content .app-editor-media-block[data-media-layout="slider"] .app-editor-media-block__item.is-active{display:block}.op-board-content .app-editor-media-block[data-media-effect="fade"] .is-active{animation:editorMediaFade .45s ease}.op-board-content .app-editor-media-block[data-media-effect="slide-left"] .is-active{animation:editorMediaSlideLeft .45s ease}.op-board-content .app-editor-media-block[data-media-effect="slide-up"] .is-active{animation:editorMediaSlideUp .45s ease}

.op-board-content .app-editor-media-block[data-media-layout="slider"]{isolation:isolate}
.op-board-content .app-editor-media-slider-ui{position:absolute;z-index:4;left:12px;right:12px;bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:none}
.op-board-content .app-editor-media-slider-prev,.op-board-content .app-editor-media-slider-next{display:flex;width:38px;height:38px;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.45);border-radius:999px;background:rgba(15,23,42,.62);color:#fff;font:600 26px/1 Arial,sans-serif;cursor:pointer;backdrop-filter:blur(6px);pointer-events:auto}
.op-board-content .app-editor-media-slider-dots{display:flex;align-items:center;justify-content:center;gap:7px;padding:7px 10px;border-radius:999px;background:rgba(15,23,42,.5);backdrop-filter:blur(6px);pointer-events:auto}
.op-board-content .app-editor-media-slider-dot{width:7px;height:7px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.48);cursor:pointer;transition:width .2s ease,background-color .2s ease}
.op-board-content .app-editor-media-slider-dot.is-active{width:20px;background:#fff}
@keyframes editorMediaFade{from{opacity:0}to{opacity:1}}@keyframes editorMediaSlideLeft{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}@keyframes editorMediaSlideUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@media (max-width:760px){.op-board-content .app-editor-media-block[data-media-width]{width:100%}.op-board-content .app-editor-media-block[data-media-layout="grid"],.op-board-content .app-editor-media-block[data-media-layout="random"]{grid-template-columns:repeat(2,minmax(0,1fr))}.op-board-content .app-editor-media-block[data-media-layout="split-left"],.op-board-content .app-editor-media-block[data-media-layout="split-right"]{grid-template-columns:1fr}.op-board-content .app-editor-media-block[data-media-layout="split-left"] .app-editor-media-block__item:first-child,.op-board-content .app-editor-media-block[data-media-layout="split-right"] .app-editor-media-block__item:first-child{grid-column:auto;grid-row:auto}}

/* Integrated utility: modal/content responsive width */
.w-\[94\%\]{width:94%}
.max-w-\[430px\]{max-width:430px}