/* Página de la demo en vivo. Clases d-; el reproductor (.c3a) usa sus propios estilos. */
:root{color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;background:#0b0810;color:#f4f1f8;font:15px/1.5 "C3A Urbanist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:#ff8fa3}
:is(a,button):focus-visible{outline:2px solid #ff8fa3;outline-offset:3px;border-radius:6px}
.d-barra{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 18px;max-width:1212px;margin:0 auto;padding:14px 16px 4px}
.d-volver{color:#f4f1f8;font-weight:700;text-decoration:none}
.d-volver:hover{color:#fff;text-decoration:underline}
.d-aviso{margin:0;font-size:13px;color:#a9a0b8}
.d-main{max-width:1212px;margin:0 auto;padding:6px 16px 24px}
.d-main .c3a{margin:8px auto 0}
/* Dentro de la web principal (marco): solo el reproductor, sin barra ni márgenes. */
.en-marco body{background:transparent}
.en-marco .d-barra{display:none}
.en-marco .d-main{padding:0}
.en-marco .d-main .c3a{margin:0 auto}