/* Visual Blog 1.0.50 — PUBLIC DISCLOSURE CONTRACT.
 * Disclosure owns clipping + Show more/less only. Density owns which media is visible.
 * Compact collapsed notes without an external main photo become their own clipping BFC,
 * preventing an inline floated video from reserving a blank area below the preview.
 */
.visual-blog-public-note-shell{position:relative;display:block;min-width:0;width:auto}
.visual-blog-public-note-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 15px;border:1px solid var(--dp-public-accent);border-radius:999px;background:#fff;color:var(--dp-public-accent);font:inherit;font-size:13px;font-weight:800;cursor:pointer}
.visual-blog-public-note-toggle[hidden]{display:none!important}
.visual-blog-public-note-shell.is-collapsible:not(.is-expanded){overflow:visible}
.visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note{position:relative;overflow:clip;max-height:320px;padding-right:96px;mask-image:none;-webkit-mask-image:none}
.visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note::after{display:none!important}
.visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note-toggle{position:absolute;right:0;bottom:0;z-index:8;margin:0;box-shadow:0 7px 18px rgba(15,23,42,.08)}
.visual-blog-public-note-shell.is-expanded .visual-blog-public-note{overflow:visible;max-height:none;padding-right:0;mask-image:none;-webkit-mask-image:none}
.visual-blog-public-note-shell.is-expanded .visual-blog-public-note::after,
.visual-blog-public-note-shell:not(.is-collapsible) .visual-blog-public-note::after{content:"";display:block;clear:both}
.visual-blog-public-note-shell.is-expanded .visual-blog-public-note-toggle{position:static;clear:both;margin:16px 0 0}

/* Normal + Compact previews keep the first inline media and omit later media until expand. */
.visual-blog-public-journal:not(.is-density-ultra):not(.is-density-text) .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-preview-secondary-media{display:none!important}

.visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-local-video-card,
.visual-blog-public-note-shell.is-collapsible:not(.is-expanded) figure:has(>video):not(.visual-blog-youtube-card),
.visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-youtube-card{max-width:300px}
.visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-local-video-card video,
.visual-blog-public-note-shell.is-collapsible:not(.is-expanded) figure:has(>video):not(.visual-blog-youtube-card)>video{max-height:220px}

/* This is the white-gap fix. overflow:hidden intentionally applies only when there is
 * no sibling main photo; therefore it contains/clips inline media floats without turning
 * the main-photo/article flow into a permanent second column. */
.visual-blog-public-journal.is-density-compact .visual-blog-public-content:not(:has(> .visual-blog-public-main-photo)) .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note,
.visual-blog-public-journal.is-density-ultra .visual-blog-public-content:not(:has(> .visual-blog-public-main-photo)) .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note{overflow:hidden}

.visual-blog-public-floating-close{position:fixed;left:50%;bottom:22px;z-index:100120;transform:translateX(-50%);display:inline-flex;align-items:center;justify-content:center;min-width:142px;min-height:46px;padding:0 18px;border:1px solid var(--dp-public-accent);border-radius:999px;background:#fff;color:var(--dp-public-accent);font:inherit;font-weight:800;box-shadow:0 14px 38px rgba(15,23,42,.20);cursor:pointer}
.visual-blog-public-floating-close[hidden]{display:none!important}

.visual-blog-public-journal.is-density-compact .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note{max-height:190px;padding-right:86px}
.visual-blog-public-journal.is-density-ultra .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note{max-height:92px;padding-right:38px}
.visual-blog-public-journal.is-density-text .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note{max-height:72px;padding-right:38px}
.visual-blog-public-journal.is-density-ultra .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note-toggle,
.visual-blog-public-journal.is-density-text .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note-toggle{width:30px;min-width:30px;max-width:30px;height:30px;min-height:30px;padding:0;font-size:0}
.visual-blog-public-journal.is-density-ultra .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note-toggle::before,
.visual-blog-public-journal.is-density-text .visual-blog-public-note-shell.is-collapsible:not(.is-expanded) .visual-blog-public-note-toggle::before{content:"↓";font-size:14px;font-weight:900;line-height:1}

@media(max-width:620px){.visual-blog-public-floating-close{bottom:14px;min-width:132px;min-height:42px}}