@layer components {
    .map {
        margin: var(--space-4) 0;
        border-radius: var(--radius-md);
        overflow: hidden;
        border: 1px solid var(--border-muted);
    }
    .map > iframe {
        display: block;
        width: 100%;
        height: 320px;
        border: 0;
    }
    .map-caption {
        padding: var(--space-2) var(--space-3);
        background: var(--bg-subtle);
        color: var(--fg-muted);
        font-size: 0.9em;
        border-top: 1px solid var(--border-muted);
    }
}