.mr-eltiempo, .mr-eltiempo * { box-sizing: border-box; }
.mr-eltiempo { margin: 0; font: 14px/1.55 Arial, sans-serif; color: #30434b; }
@media (max-width: 840px) {
.mr-eltiempo.informe { padding-inline: 16px; }
}
.mr-eltiempo.informe {
    max-width: 840px;
    margin: 0 auto;
    container-type: inline-size;
    display: grid;
    grid-template-columns: minmax(0, 1fr) repeat(2, minmax(0, 1.15fr));
    gap: 24px 28px;
}
.mr-eltiempo .actual {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(190px, 1fr) minmax(240px, 1.25fr);
    gap: 28px;
    padding: 20px 22px 24px;
    background: #f4f8fa;
    border-top: 3px solid #7096a5;
    border-bottom: 1px solid #dce4e7;
}
.mr-eltiempo .avisos, .mr-eltiempo .avisos-estado { grid-column: 1 / -1; }
.mr-eltiempo .correr { grid-column: 1 / -1; padding: 16px 20px; border-left: 3px solid var(--estado); --estado: #23834b; background: #f2f7f3; }
.mr-eltiempo .correr[data-nivel="1"] { --estado: #956500; background: #faf7ed; }
.mr-eltiempo .correr[data-nivel="2"] { --estado: #ae302f; background: #fbf2f1; }
.mr-eltiempo .correr[data-nivel="3"] { --estado: #627078; background: #f5f6f6; }
.mr-eltiempo .correr header { display: flex; gap: 14px; align-items: center; }
.mr-eltiempo .correr header svg, .mr-eltiempo .correr h2 { color: var(--estado); }
.mr-eltiempo .correr h2 { margin: 0; font-size: 19px; }
.mr-eltiempo .correr dl { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; border-top: 1px solid #dce4e7; }
.mr-eltiempo .correr dl > div { display: block; border: 0; }
.mr-eltiempo .correr dd { max-width: none; text-align: left; }
.mr-eltiempo .correr .nota { font-size: 12px; color: #61717a; }
.mr-eltiempo .correr details { margin-top: 12px; border-top: 1px solid #dce4e7; padding-top: 8px; font-size: 13px; }
.mr-eltiempo .correr summary { cursor: pointer; }
.mr-eltiempo :is(.correr, .luna) details > :is(summary, p),
.mr-eltiempo :is(.correr, .luna) details p :is(a, .valor) { font-size: inherit; }
.mr-eltiempo .correr details > p { margin: 6px 0 0; line-height: 1.5; }
@container (max-width: 420px) {
.mr-eltiempo .correr dl { grid-template-columns: 1fr; gap: 0; }
}
.mr-eltiempo .avisos-estado { margin: 0; font-size: 12px; color: #61717a; }
.mr-eltiempo .avisos { --tinta: #50626b; --fondo: #f4f6f7; border-left: 3px solid var(--tinta); background: var(--fondo); }
.mr-eltiempo .avisos[data-nivel="amarillo"] { --tinta: #806000; --fondo: #fbf7e9; }
.mr-eltiempo .avisos[data-nivel="naranja"] { --tinta: #a2480b; --fondo: #fff3e8; }
.mr-eltiempo .avisos[data-nivel="rojo"] { --tinta: #ab2434; --fondo: #fcf0f1; }
.mr-eltiempo .avisos summary { display: flex; align-items: center; gap: 14px; padding: 16px 20px; cursor: pointer; list-style: none; color: var(--tinta); }
.mr-eltiempo .avisos summary::-webkit-details-marker { display: none; }
.mr-eltiempo .avisos summary svg { flex: none; }
.mr-eltiempo .avisos summary strong { display: block; font-size: 19px; }
.mr-eltiempo .avisos summary::after { content: ''; width: 8px; height: 8px; margin-left: auto; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.mr-eltiempo .avisos[open] summary::after { transform: rotate(225deg); }
.mr-eltiempo .avisos article { margin: 0 20px; padding: 14px 0; border-top: 1px solid #dce4e7; }
.mr-eltiempo .avisos h3 { margin: 0; font-size: 16px; }
.mr-eltiempo .avisos h3 span { padding: .15em .55em; border-radius: .25em; color: #171717; }
.mr-eltiempo .avisos h3 [data-nivel="amarillo"] { background: #ffda44; }
.mr-eltiempo .avisos h3 [data-nivel="naranja"] { background: #ff982f; }
.mr-eltiempo .avisos h3 [data-nivel="rojo"] { background: #ad1725; color: white; }
.mr-eltiempo .avisos p { margin: 8px 0 0; }
.mr-eltiempo .avisos .vigencia { font-size: 12px; color: #61717a; }
.mr-eltiempo .lectura { display: flex; align-items: center; gap: 18px; min-height: 110px; }
.mr-eltiempo .temperatura { display: inline-flex; font-size: 64px; line-height: 1.1; letter-spacing: -2px; color: #365f70; }
.mr-eltiempo .temperatura .unidad { display: grid; justify-items: center; letter-spacing: normal; }
.mr-eltiempo .unidad > * { grid-area: 1 / 1; }
.mr-eltiempo .unidad small { align-self: end; margin-bottom: 0.34em; font-size: 22px; line-height: 1; }
.mr-eltiempo .condicion { margin: 14px 0 6px; font-size: 23px; line-height: 1.3; font-weight: 500; color: #365f70; }
.mr-eltiempo .hora { margin: 8px 0 14px; font-size: 12px; color: #61717a; }
.mr-eltiempo .solar, .mr-eltiempo .radiacion, .mr-eltiempo .luna { padding: 12px 0 18px; border-top: 2px solid #d6c296; }
.mr-eltiempo .radiacion { display: grid; grid-template-rows: 1fr auto 1fr; row-gap: 10px; padding-block: 12px; border-color: #cfb48c; }
.mr-eltiempo .solar h2, .mr-eltiempo .radiacion h2, .mr-eltiempo .luna h2 { margin: 0; font-size: 16px; color: #6a634e; }
.mr-eltiempo .radiacion h2 { align-self: start; }
.mr-eltiempo .radiacion .nota-solar { grid-row: 3; margin: 0; text-align: center; }
.mr-eltiempo .radiacion:has(.indicador-uv) { grid-template-rows: minmax(44px, 1fr) auto 1fr; }
.mr-eltiempo .uv-ausente { justify-self: center; }
.mr-eltiempo .nota-solar, .mr-eltiempo .luna details { font-size: 12px; color: #61717a; }
.mr-eltiempo .luna details { margin-top: 14px; }
.mr-eltiempo .luna details > p { margin: 4px 0 0; padding: 0; line-height: 1.4; }
.mr-eltiempo .luna { border-color: #b6aecb; }
.mr-eltiempo .luna h2 { color: #6b6280; }
.mr-eltiempo .luna dl { margin-top: 8px; }
.mr-eltiempo .luna summary { cursor: pointer; }
.mr-eltiempo .escala-uv { position: relative; grid-row: 2; width: min(100%, 230px); justify-self: center; height: 6px; background: linear-gradient(to right, #4c9e3a 0 20%, #edcf30 20% 40%, #e99529 40% 60%, #c9443c 60% 80%, #8c4b96 80% 100%); }
.mr-eltiempo .indicador-uv { position: absolute; bottom: 100%; transform: translateX(-50%); display: grid; justify-items: center; gap: 2px; color: #43555e; font: 600 14px/1 system-ui, sans-serif; }
.mr-eltiempo .indicador-uv::after { content: ''; border-inline: 4px solid transparent; border-top: 5px solid #333; }
.mr-eltiempo .horizonte { max-width: 210px; margin: auto; }
.mr-eltiempo .horizonte svg { display: block; width: 100%; }
.mr-eltiempo .trayectoria { fill: none; stroke: #cfb48c; stroke-dasharray: 3 3; }
.mr-eltiempo .suelo { stroke: #8d999e; }
.mr-eltiempo .horas-solares { display: flex; justify-content: space-between; font-size: 13px; color: #61717a; }
.mr-eltiempo .horas-solares b { display: block; font-size: 16px; }
.mr-eltiempo .horas-solares span:last-child { text-align: right; }
.mr-eltiempo dl, .mr-eltiempo dd { margin: 0; }
.mr-eltiempo dl > div { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 6px 0; border-bottom: 1px solid #e0e8ec; }
.mr-eltiempo dt { font-size: 13px; color: #61717a; }
.mr-eltiempo dd { max-width: 65%; text-align: right; font-weight: 500; }
.mr-eltiempo .valor, .mr-eltiempo .correr dd, .mr-eltiempo .horas-solares b, .mr-eltiempo .luna dd, .mr-eltiempo .periodo dd, .mr-eltiempo .resumen-periodo strong { font-family: system-ui, sans-serif; font-weight: 600; color: #43555e; }
@container (max-width: 580px) {
.mr-eltiempo .actual { grid-template-columns: 1fr; }
.mr-eltiempo .solar, .mr-eltiempo .radiacion, .mr-eltiempo .luna { grid-column: 1 / -1; padding-inline: 14px; }
}
@container (max-width: 420px) {
.mr-eltiempo .actual { padding: 16px 14px; }
.mr-eltiempo .condicion { font-size: 21px; }
}
.mr-eltiempo .prevision { grid-column: 1 / -1; }
.mr-eltiempo .prevision header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; padding-bottom: 8px; color: #365f70; border-bottom: 2px solid #7096a5; }
.mr-eltiempo .prevision h2 { margin: 0; font-size: 23px; line-height: 1.3; font-weight: 600; }
.mr-eltiempo .prevision header a { color: #207dad; font-size: 12px; }
.mr-eltiempo .prevision .titular { font-size: 15px; padding: 8px 0; }
.mr-eltiempo .prevision .nota { color: #61717a; font-size: 12px; }
.mr-eltiempo .prevision article { border-bottom: 1px solid #dce4e7; padding: 22px 0; }
.mr-eltiempo .prevision h3 { background: #f3f6f7; color: #476372; margin: 0; padding: 10px 12px; font-size: 18px; font-weight: 600; text-transform: capitalize; }
.mr-eltiempo .dia-noche { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px; }
.mr-eltiempo .periodo { padding-top: 16px; }
.mr-eltiempo .periodo + .periodo { border-left: 1px solid #eee; padding-left: 24px; }
.mr-eltiempo .periodo h4 { margin: 0 0 12px; color: #666; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; }
.mr-eltiempo .resumen-periodo { display: flex; align-items: center; gap: 16px; min-height: 90px; margin-bottom: 12px; }
.mr-eltiempo .resumen-periodo img { flex: none; }
.mr-eltiempo .resumen-periodo span { display: block; font-size: 11px; color: #61717a; margin-bottom: 2px; }
.mr-eltiempo .resumen-periodo strong { font-size: 27px; color: #b23832; }
.mr-eltiempo .periodo + .periodo strong { color: #286a9c; }
.mr-eltiempo .resumen-periodo p { font-size: 13px; margin: 4px 0; }
.mr-eltiempo .periodo dl > div { border-bottom: 0; }
.mr-eltiempo .periodo dt svg { vertical-align: middle; margin-right: 7px; color: #a87828; }
.mr-eltiempo .periodo + .periodo dt svg { color: #9b6551; }
.mr-eltiempo .fuentes { grid-column: 1 / -1; border-top: 1px solid #dce4e7; padding: 16px 0; font-size: 11px; color: #52616b; }
.mr-eltiempo .fuentes a { color: #245b78; text-underline-offset: 3px; }
@container (max-width: 735px) {
.mr-eltiempo .dia-noche { grid-template-columns: minmax(0, 1fr); gap: 0; }
.mr-eltiempo .periodo + .periodo { padding-left: 0; border-left: 0; border-top: 1px solid #eee; margin-top: 16px; }
}
@container (max-width: 580px) {
.mr-eltiempo .resumen-periodo { align-items: flex-start; gap: 8px; }
.mr-eltiempo .resumen-periodo img { width: 44px; height: 44px; }
}
@container (max-width: 380px) {
.mr-eltiempo .prevision header { flex-direction: column; gap: 4px; }
}
.mr-enlace-tiempo { display: block; color: inherit; text-decoration: none !important; }
.mr-enlace-tiempo:focus-visible { outline: 2px solid #365f70; outline-offset: 3px; }
.mr-eltiempo.compacto { container-type: inline-size; }
.mr-eltiempo.compacto .actual { display: block; border-top: 0; text-align: center; padding: 16px 12px; }
.mr-eltiempo.compacto .lectura { justify-content: center; gap: 10px; min-height: 84px; }
.mr-eltiempo.compacto .lectura img { width: 76px; height: 76px; }
.mr-eltiempo.compacto .temperatura { font-size: 44px; }
.mr-eltiempo.compacto .condicion { font-size: 20px; margin: 10px 0; }
.mr-eltiempo.compacto .correr { margin: 16px 0; padding: 12px; border: 0; }
.mr-eltiempo.compacto .correr header { gap: 10px; }
.mr-eltiempo.compacto .correr svg { width: 34px; height: 34px; }
.mr-eltiempo.compacto .correr h2 { font-size: 16px; }
.mr-eltiempo.compacto .correr header span { font-size: 12px; }
.mr-eltiempo.compacto .correr p { margin: 8px 0; }
.mr-eltiempo .enlace-informe { display: block; }
