@layer reset,tokens,base,components;@layer features{.post-image,.post-carousel,.diagram-container{flex-direction:column;align-items:center;display:flex;position:relative}.post-image-content,.post-carousel-content{gap:var(--space-16);margin-block:var(--space-24);flex-direction:column;display:flex}.post-image-frame{position:relative}.post-image-trigger{cursor:zoom-in}.post-image-trigger:focus-visible{outline:var(--focus-outline);outline-offset:-4px}.post-image-single-trigger{border-radius:var(--radius-12);outline:1px solid var(--color-surface-tint);width:100%;display:block;overflow:hidden}.post-image-single-trigger>picture{margin:0}.post-image-photo{width:100%;transition:transform var(--duration-moderate) var(--ease-in-out);margin:0}@media (width>=40rem){.post-image-single-trigger{border-radius:var(--radius-16)}}@media (hover:hover) and (prefers-reduced-motion:no-preference){.post-image-frame:hover .post-image-photo{transform:scale(1.03)}}@media (prefers-reduced-motion:reduce){.post-image-photo{transition:none}}.post-image-caption{--post-image-caption-surface:color-mix(in srgb, var(--color-background) 85%, transparent);font-size:var(--text-12);line-height:var(--leading-snug);margin:var(--space-12) 0 0;color:var(--color-muted-foreground);text-align:center;overflow-wrap:anywhere}@media (width>=40rem){.post-image-caption{font-size:var(--text-14);bottom:var(--space-16);width:max-content;max-width:calc(100% - var(--space-32));padding:var(--space-8) var(--space-12);border-radius:var(--radius-12);background:var(--post-image-caption-surface);color:var(--color-foreground);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:opacity .16s ease, transform var(--duration-moderate) var(--ease-ui);margin:0;position:absolute;left:50%;transform:translate(-50%)}}.post-image-caption>:first-child{margin-top:0}.post-image-caption>:last-child{margin-bottom:0}@media (width>=40rem) and (hover:hover) and (pointer:fine){.post-image-caption-host:not(:hover):not(:has(:focus-visible)) .post-image-caption{opacity:0;pointer-events:none;transform:translate(-50%,6px)}}.post-image-caption-host:has(:focus-visible) .post-image-caption{transition:none}@media (width>=40rem) and (prefers-reduced-motion:reduce){.post-image-caption-host .post-image-caption{transition:none;transform:translate(-50%)}}}@layer utilities;
