.page-public-gallery .public-gallery,.page-public-gallery .public-material { max-width: 100%; padding: 8px 0 34px; color: #183b5d; }
.page-public-gallery .public-back { display: inline-flex; align-items: center; min-height: 44px; margin: 0 0 13px; padding: 8px 13px; border: 1px solid #e2f0fa; border-radius: 24px; background: #fff; color: #1578ad; font-size: 13px; font-weight: 850; }
.page-public-gallery .public-back:hover { background: #effaff; }
.page-public-gallery .public-gallery-heading { --gal-color: #078acb; --gal-bg: #eaf7ff; --gal-border: #c8e6fa; display: grid; grid-template-columns: 60px minmax(0, 1fr) auto auto; align-items: center; gap: 15px; margin: 0 0 22px; padding: 20px 22px; border: 1px solid var(--gal-border); border-radius: 24px; background: linear-gradient(110deg, var(--gal-bg), #fff 78%); }
.page-public-gallery .public-gallery-heading.theme-peach,.page-public-gallery .public-material-card.theme-peach { --gal-color: #eb5684; --gal-bg: #fff1ed; --gal-border: #ffe0df; }
.page-public-gallery .public-gallery-heading.theme-mint,.page-public-gallery .public-material-card.theme-mint { --gal-color: #00a77f; --gal-bg: #eafaf1; --gal-border: #cef0dd; }
.page-public-gallery .public-gallery-heading.theme-purple,.page-public-gallery .public-material-card.theme-purple { --gal-color: #8450df; --gal-bg: #f3edff; --gal-border: #e3d8ff; }
.page-public-gallery .public-gallery-heading.theme-pink,.page-public-gallery .public-material-card.theme-pink { --gal-color: #df488e; --gal-bg: #fff0f7; --gal-border: #ffd8ea; }
.page-public-gallery .public-gallery-icon { display: grid; width: 60px; height: 60px; place-items: center; border-radius: 18px; background: #ffffffc9; }
.page-public-gallery .public-gallery-icon img { object-fit: contain; }
.page-public-gallery .public-gallery-kicker { display: block; color: var(--gal-color, #248db6); font-size: 11px; font-weight: 900; letter-spacing: .7px; }
.page-public-gallery .public-gallery-heading h1 { margin: 3px 0 2px; color: #193b60; font-size: 27px; font-weight: 950; line-height: 1.2; }
.page-public-gallery .public-gallery-heading p { margin: 0; color: #6c8397; font-size: 13px; line-height: 1.5; }
.page-public-gallery .public-gallery-count { padding: 8px 12px; border: 1px solid var(--gal-border); border-radius: 20px; background: #fff; color: var(--gal-color); font-size: 12px; font-weight: 900; white-space: nowrap; }
.page-public-gallery .public-gallery-heading .button,.page-public-gallery .public-material-footer .button,.page-public-gallery .public-gallery-empty .button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 15px; border: 0; border-radius: 13px; background: linear-gradient(120deg, #0aa6ee, #0875d7); color: white; font-size: 13px; font-weight: 900; }
.page-public-gallery .public-gallery-heading .button svg,.page-public-gallery .public-material-footer .button svg,.page-public-gallery .public-gallery-empty .button svg { width: 17px; height: 17px; }
.page-public-gallery .public-post-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: stretch; gap: 18px 14px; }
.page-public-gallery .public-post { --gal-color: #078acb; --gal-bg: #effaff; --gal-border: #d9f2ff; display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid var(--gal-border); border-radius: 21px; background: var(--gal-bg); box-shadow: 0 5px 0 var(--gal-border), 0 10px 20px #315c7810; transition: transform .2s, box-shadow .2s; }
.page-public-gallery .public-post.theme-peach { --gal-color: #eb5684; --gal-bg: #fff6f3; --gal-border: #ffede5; }
.page-public-gallery .public-post.theme-mint { --gal-color: #00a77f; --gal-bg: #effcf6; --gal-border: #dcf8e9; }
.page-public-gallery .public-post.theme-purple { --gal-color: #8450df; --gal-bg: #f7f3ff; --gal-border: #eee6ff; }
.page-public-gallery .public-post.theme-pink { --gal-color: #df488e; --gal-bg: #fff1f8; --gal-border: #ffe3f2; }
.page-public-gallery .public-post:hover { transform: translateY(-3px); box-shadow: 0 7px 0 var(--gal-border), 0 14px 25px #315c7818; }
.page-public-gallery .public-post-art { position: relative; display: block; aspect-ratio: 1.2; overflow: hidden; background: var(--gal-bg); }
.page-public-gallery .public-post-art>.atlas,.page-public-gallery .public-post-image { display: block; width: 100%; height: 100%; object-fit: cover; }
.page-public-gallery .public-post-art>.atlas { position: absolute; inset: 0; }
.page-public-gallery .public-open { position: absolute; right: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 5px; padding: 8px 10px; border: 1px solid #fff; border-radius: 22px; background: #ffffffeb; color: #31546e; font-size: 11px; font-weight: 900; opacity: 0; transform: translateY(4px); transition: opacity .18s, transform .18s; }
.page-public-gallery .public-post-art:hover .public-open,.page-public-gallery .public-post-art:focus-visible .public-open { opacity: 1; transform: none; }
.page-public-gallery .public-open svg { width: 14px; height: 14px; }
.page-public-gallery .public-post-copy { display: flex; flex: 1; flex-direction: column; align-items: flex-start; margin-top: -16px; padding: 17px 15px 14px; border: 1px solid #ffffffd9; border-radius: 22px 26px 0 0; background: linear-gradient(130deg, #fff, var(--gal-bg)); }
.page-public-gallery .public-post-category { color: var(--gal-color); font-size: 10px; font-weight: 900; letter-spacing: .3px; }
.page-public-gallery .public-post-copy h2 { margin: 5px 0 4px; color: #173c62; font-size: 17px; font-weight: 950; line-height: 1.3; }
.page-public-gallery .public-post-copy h2 a:hover { color: var(--gal-color); }
.page-public-gallery .public-post-copy p { margin: 0; color: #7790a7; font-size: 11px; }
.page-public-gallery .public-post-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; padding: 8px 12px; border: 1px solid var(--gal-border); border-radius: 12px; background: white; color: var(--gal-color); font-size: 12px; font-weight: 900; }
.page-public-gallery .public-post-link:hover { background: var(--gal-bg); }
.page-public-gallery .public-pagination { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 24px; padding: 15px; border: 1px solid #e6f1fa; border-radius: 18px; background: #fff; color: #66819a; font-size: 13px; font-weight: 800; }
.page-public-gallery .public-pagination a { color: #0788c5; }
.page-public-gallery .public-gallery-empty { display: grid; justify-items: center; gap: 12px; padding: 55px 20px; border: 1px dashed #cde8f6; border-radius: 24px; background: #f8fcff; text-align: center; }
.page-public-gallery .public-gallery-empty h2 { margin: 0; color: #193b60; font-size: 23px; }
.page-public-gallery .public-gallery-empty p { max-width: 420px; margin: 0; color: #6c8397; font-size: 14px; line-height: 1.6; }
.page-public-gallery .public-material-card { --gal-color: #078acb; --gal-bg: #effaff; --gal-border: #d9f2ff; overflow: hidden; border: 1px solid var(--gal-border); border-radius: 26px; background: white; box-shadow: 0 8px 0 var(--gal-border), 0 15px 30px #315c7810; }
.page-public-gallery .public-material-heading { display: flex; align-items: center; gap: 15px; padding: 21px; background: linear-gradient(110deg, var(--gal-bg), #fff 80%); }
.page-public-gallery .public-material-heading>img { flex: 0 0 54px; object-fit: contain; }
.page-public-gallery .public-material-heading h1 { margin: 3px 0; color: #193b60; font-size: 25px; line-height: 1.25; }
.page-public-gallery .public-material-heading p { margin: 0; color: #6c8397; font-size: 12px; }
.page-public-gallery .public-material-images { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,240px),1fr)); gap: 12px; padding: 18px; }
.page-public-gallery .public-material-images figure { margin: 0; overflow: hidden; border: 1px solid var(--gal-border); border-radius: 18px; background: var(--gal-bg); }
.page-public-gallery .public-material-images img { display: block; width: 100%; height: auto; }
.page-public-gallery .public-material-content { padding: 22px; border-top: 1px solid #edf3f8; }
.page-public-gallery .public-material-content h2 { margin: 0 0 12px; color: #193b60; font-size: 19px; }
.page-public-gallery .public-material-content pre { margin: 0; padding: 20px; overflow-wrap: anywhere; white-space: pre-wrap; border: 1px solid #e4eff7; border-radius: 16px; background: #f8fbfe; color: #435f78; font-family: inherit; font-size: 15px; line-height: 1.8; }
.page-public-gallery .public-material-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 17px 22px; border-top: 1px solid #edf3f8; color: #607b95; font-size: 13px; font-weight: 800; }
@media (max-width: 900px) { .page-public-gallery .public-post-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px 12px; } }
@media (max-width: 640px) {
    .page-public-gallery .public-gallery { padding-top: 0; }
    .page-public-gallery .public-gallery-heading { grid-template-columns: 48px minmax(0,1fr); gap: 10px; padding: 15px; border-radius: 20px; }
    .page-public-gallery .public-gallery-icon { width: 46px; height: 46px; border-radius: 14px; }
    .page-public-gallery .public-gallery-icon img { width: 44px; height: 44px; }
    .page-public-gallery .public-gallery-heading h1 { font-size: 21px; }
    .page-public-gallery .public-gallery-heading p { font-size: 12px; }
    .page-public-gallery .public-gallery-count { grid-column: 1; justify-self: start; padding: 6px 8px; font-size: 10px; }
    .page-public-gallery .public-gallery-heading .button { grid-column: 2; justify-self: start; font-size: 12px; }
    .page-public-gallery .public-post-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px 11px; }
    .page-public-gallery .public-post-art { aspect-ratio: 1; }
    .page-public-gallery .public-post-copy { padding: 14px 11px 12px; }
    .page-public-gallery .public-post-copy h2 { font-size: 15px; }
    .page-public-gallery .public-post-link { min-height: 40px; }
    .page-public-gallery .public-material-heading { align-items: flex-start; padding: 17px; }
    .page-public-gallery .public-material-heading h1 { font-size: 21px; }
    .page-public-gallery .public-material-content { padding: 15px; }
    .page-public-gallery .public-material-content pre { padding: 15px; font-size: 14px; }
    .page-public-gallery .public-material-footer { padding: 16px; }
}
@media (max-width: 359px) { .page-public-gallery .public-post-grid { grid-template-columns: minmax(0,1fr); } }
@media (hover: none) { .page-public-gallery .public-open { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .page-public-gallery .public-post,.page-public-gallery .public-open { transition: none; } }