.podcast-dialog { box-sizing: border-box; width: min(520px, calc(100% - 24px)); max-height: calc(100dvh - 24px); padding: 16px; overflow: auto; border: 1px solid #e3dcd2; border-radius: 24px; background: #fffcf8; color: #1c1915; font-family: 'Fira Sans Condensed', system-ui, sans-serif; box-shadow: 0 24px 80px #0005; }
.podcast-dialog::backdrop { background: #172c2bb3; backdrop-filter: blur(8px); }
.podcast-title { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.podcast-close { position: absolute; right: 24px; top: 24px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid #fff8; border-radius: 50%; background: #fffcf8; color: #1e3f3a; font: 400 1.8rem/1 system-ui, sans-serif; cursor: pointer; box-shadow: 0 2px 12px #0003; }
.podcast-cover { display: block; width: 100%; height: auto; max-height: max(160px, calc(100dvh - 190px)); object-fit: contain; border-radius: 14px; }
.podcast-caption { margin: 16px 0 12px; text-align: center; color: #6f685f; font-size: 1rem; }
.podcast-platforms { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.podcast-platform { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 58px; padding: 10px; border: 1px solid #e3dcd2; border-radius: 14px; background: #f4f0e9; color: #1e3f3a; font: 500 1.05rem/1.2 'Fira Sans Condensed', system-ui, sans-serif; text-decoration: none; }
.podcast-platform img { width: 34px; height: 34px; object-fit: contain; flex: none; }
.podcast-platform:hover { background: #e9e4db; border-color: #1e3f3a; }
.podcast-dialog :focus-visible { outline: 3px solid #1e3f3a; outline-offset: 3px; }
@media (max-width: 360px) { .podcast-platform { flex-direction: column; gap: 6px; font-size: .95rem; } }