/* Letras: Asap Sharp (texto), Quicksand (títulos) e Oxanium (nome no logótipo e menus), variáveis,
   servidas pelo próprio site (sem pedidos à Google: RGPD). Licença SIL OFL 1.1 (public/fontes/LICENSE-*.txt). O subconjunto latin-ext só é descarregado se a página o usar. */
@font-face{font-family:"Asap Sharp";font-style:normal;font-display:swap;font-weight:100 900;src:url(/fontes/asap-sharp-latin-wght-normal.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Asap Sharp";font-style:normal;font-display:swap;font-weight:100 900;src:url(/fontes/asap-sharp-latin-ext-wght-normal.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Quicksand";font-style:normal;font-display:swap;font-weight:300 700;src:url(/fontes/quicksand-latin-wght-normal.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Quicksand";font-style:normal;font-display:swap;font-weight:300 700;src:url(/fontes/quicksand-latin-ext-wght-normal.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Oxanium";font-style:normal;font-display:swap;font-weight:200 800;src:url(/fontes/oxanium-latin-wght-normal.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--fundo:#fff;--texto:#141414;--suave:#5c5c5c;--apagado:#767676;--linha:#e5e5e5;--destaque:#9b2c1f;--titulos:"Quicksand",system-ui,sans-serif;color-scheme:light}
/* Tema escuro: o do sistema, salvo escolha "claro" no botão; ou escolha "escuro". */
@media (prefers-color-scheme:dark){:root:not([data-tema=claro]){--fundo:#121212;--texto:#ececec;--suave:#a6a6a6;--apagado:#858585;--linha:#2b2b2b;--destaque:#e8846f;color-scheme:dark}}
:root[data-tema=escuro]{--fundo:#121212;--texto:#ececec;--suave:#a6a6a6;--apagado:#858585;--linha:#2b2b2b;--destaque:#e8846f;color-scheme:dark}
/* Primeira letra de cada entrada na cor de destaque (ou o número inteiro, se começar por um). */
.entrada p:not(.com-numero)::first-letter,.entrada .inicial{color:var(--destaque);font-weight:600}
.rolar{position:fixed;right:1.25rem;bottom:1.25rem;z-index:5;display:flex;flex-direction:column;gap:.5rem}.rolar[hidden]{display:none}
.rolar button{width:2.6rem;height:2.6rem;border-radius:50%;display:grid;place-items:center;padding:0;background:var(--fundo);color:var(--texto);border:1px solid var(--linha);box-shadow:0 4px 14px rgba(0,0,0,.12);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(.5rem);transition:opacity .2s,transform .2s,visibility .2s,border-color .15s}
.rolar button.visivel{opacity:1;visibility:visible;transform:none}.rolar button:hover{border-color:var(--destaque);color:var(--destaque)}
@media (prefers-reduced-motion:reduce){.rolar button{transition:none}}
/* Feriados: legenda, pontos de cor por tipo, aviso nos acontecimentos e janela de confirmação. */
.ponto{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;margin-right:.45rem;vertical-align:middle;flex:none}
.ponto.nacional{background:var(--destaque)}.ponto.regional{background:#c77d1a}.ponto.facultativo{background:#5b7fa6}.ponto.comemorativo{background:var(--suave)}
.legenda{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;list-style:none;padding:0;border:0;margin:.25rem 0 1rem;font-size:.85rem;color:var(--suave)}
.legenda label{display:inline-flex;align-items:center;gap:.1rem;cursor:pointer;user-select:none;border-radius:4px;padding:.15rem .35rem;transition:opacity .15s}
/* A caixa fica escondida (mas acessível ao teclado e aos leitores de ecrã): clicar no nome liga/desliga o tipo. */
.legenda input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.legenda label:has(input:focus-visible){outline:2px solid var(--destaque);outline-offset:1px}
.legenda label:has(input:not(:checked)){opacity:.45;text-decoration:line-through}
.legenda label:hover{background:color-mix(in srgb,var(--suave) 12%,transparent)}
.ponto.antigo{background:transparent;border:1.5px solid var(--suave)}.feriado.antigo strong{font-weight:500;color:var(--suave)}
/* Caixas da legenda: esconder um tipo de feriado (funciona sem JavaScript). */
main:has(#ver-nacional:not(:checked)) .feriado.nacional,main:has(#ver-regional:not(:checked)) .feriado.regional,main:has(#ver-facultativo:not(:checked)) .feriado.facultativo,main:has(#ver-comemorativo:not(:checked)) .feriado.comemorativo,main:has(#ver-antigo:not(:checked)) .feriado.antigo{display:none}
.feriado{display:flex;align-items:baseline;gap:.25rem;padding:.6rem 0;border-bottom:1px solid var(--linha)}.feriado p{margin:0}
.ano-secao{font-size:.9rem}
.alerta-feriado{display:flex;align-items:center;gap:.2rem;margin:0 0 1rem;padding:.7rem 1rem;border:1px solid var(--destaque);border-radius:6px;text-decoration:none;font-size:.95rem}
main>button.alerta-feriado{margin-top:1rem}button.alerta-feriado{width:100%;font:inherit;color:inherit;background:none;text-align:left;cursor:pointer;line-height:1.5}
/* Mudança de hora: ícone de relógio a recuar (ou a avançar, espelhado) e "às 02:00 passam a ser 01:00". */
.icone-hora{flex:none;color:var(--destaque);margin-right:.35rem}.icone-hora.frente{transform:scaleX(-1)}.horas-mudanca time{font-variant-numeric:tabular-nums}
/* Janela: ‹ ano › por baixo do título. */
.dialogo .titulo-marcos{margin:0 0 .25rem}.dialogo .ano-marcos{display:flex;align-items:center;gap:.75rem;margin:0 0 1rem;font-variant-numeric:tabular-nums}
.seta-ano{border:0;background:none;color:var(--suave);font:inherit;font-size:1.3rem;line-height:1;padding:0 .3rem;cursor:pointer}.seta-ano:hover{color:var(--destaque)}.seta-ano:disabled{visibility:hidden}
.lista-marcos{margin:0 0 1.25rem}.lista-marcos li{margin:0 0 .6rem}
.alerta-feriado:hover{background:color-mix(in srgb,var(--destaque) 8%,transparent)}
.dialogo{border:1px solid var(--linha);border-radius:10px;padding:1.25rem 1.5rem;background:var(--fundo);color:var(--texto);max-width:24rem;box-shadow:0 12px 40px rgba(0,0,0,.25)}
.dialogo::backdrop{background:rgba(0,0,0,.35)}.dialogo p{margin:0 0 1rem}
.dialogo button.principal{border-color:var(--destaque);color:var(--destaque)}
.lua-hoje{font-size:1.1rem}.atribuicao{font-size:.75rem;overflow-wrap:anywhere}
/* Página Lua: desenho da fase (brilho suave a pulsar) e gráfico da maré (linha a desenhar-se, água a subir). */
.desenho-lua{display:block;margin:.5rem 0 1rem;overflow:visible}
.lua-sombra{fill:#2a2d34}.lua-luz,.lua-luz-mini{fill:#f3ead0}.crateras circle{fill:#000;opacity:.07}
:root[data-tema=escuro] .lua-sombra{fill:#23262c}
.desenho-lua{animation:brilho-lua 5s ease-in-out infinite}
@keyframes brilho-lua{0%,100%{filter:drop-shadow(0 0 6px rgba(243,234,208,.35))}50%{filter:drop-shadow(0 0 16px rgba(243,234,208,.7))}}
.grafico-mare{width:100%;height:auto;display:block;margin:.5rem 0 1rem;overflow:visible}
.mare-linha{fill:none;stroke:#3d7fb8;stroke-width:2.2;stroke-dasharray:1;stroke-dashoffset:0;animation:desenhar-mare 2.2s ease-out both}
.mare-area{animation:subir-mare 2.2s ease-out both}
@keyframes desenhar-mare{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes subir-mare{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}
.mare-marca circle{fill:var(--fundo);stroke:#3d7fb8;stroke-width:2}.mare-marca.preia circle{stroke:var(--destaque)}
.mare-marca text,.mare-agora-txt{font-size:11px;fill:var(--suave);text-anchor:middle;font-family:"Asap Sharp",system-ui,sans-serif}
.mare-marca{opacity:0;animation:aparecer .4s ease-out 1.8s both}
@keyframes aparecer{to{opacity:1}}
.mare-agora{stroke:var(--destaque);stroke-width:1.5;stroke-dasharray:3 3;animation:pulsar 2s ease-in-out infinite}
@keyframes pulsar{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.desenho-lua,.mare-linha,.mare-area,.mare-marca,.mare-agora{animation:none;opacity:1}}
.feriado.passado .data-feriado,.feriado.passado strong{color:var(--suave);font-weight:500}.data-feriado{display:inline-block;min-width:11rem;color:var(--suave);font-size:.9rem}
.nascer-por{border-collapse:collapse;margin:.5rem 0 1rem;font-size:.95rem}.nascer-por th,.nascer-por td{padding:.3rem 1.25rem .3rem 0;text-align:left}.nascer-por thead th{color:var(--suave);font-weight:400}
/* Meteo: agora (ícone grande, temperatura, detalhes), faixa das próximas 24 h (desliza na horizontal) e tabela dos 7 dias. */
:root{--nuvem:#c9ced6;--nuvem2:#a9b0ba;--chuva:#2c6797}
@media (prefers-color-scheme:dark){:root:not([data-tema=claro]){--nuvem:#8d949e;--nuvem2:#6b727c;--chuva:#7fb4e0}}
:root[data-tema=escuro]{--nuvem:#8d949e;--nuvem2:#6b727c;--chuva:#7fb4e0}
.meteo-agora{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.75rem;margin:.75rem 0 1.5rem}
.meteo-temp{font-family:var(--titulos);font-size:3.2rem;font-weight:600;line-height:1;margin:0}.meteo-cond{margin:.25rem 0 0}
.meteo-detalhes{display:grid;grid-template-columns:auto auto;gap:.2rem 1rem;margin:0;font-size:.95rem}
.meteo-detalhes div{display:contents}.meteo-detalhes dt{color:var(--suave)}.meteo-detalhes dd{margin:0;white-space:nowrap}
.seta-vento{vertical-align:-2px;fill:currentColor}
details.textos>details{margin-left:1rem}.meteo-rolo{overflow-x:auto;margin:.5rem 0 1.25rem;padding-bottom:.5rem;scroll-snap-type:x proximity}.meteo-curva{display:block;height:3.5rem;margin-bottom:.25rem}.curva-area{fill:var(--destaque);opacity:.1}.curva-linha{fill:none;stroke:var(--destaque);stroke-width:2;stroke-linejoin:round}.curva-pontos{stroke:var(--destaque);stroke-width:6;stroke-linecap:round}
.meteo-horas{display:flex;gap:.25rem;list-style:none;padding:0;margin:0}
.meteo-horas li{flex:0 0 3.7rem;display:flex;flex-direction:column;align-items:center;gap:.15rem;font-size:.85rem;scroll-snap-align:start}
.meteo-chuva{color:var(--chuva);font-size:.8rem}
.meteo-dias{width:100%;border-collapse:collapse;margin:.5rem 0 1rem}
.meteo-dias th,.meteo-dias td{padding:.25rem .6rem .25rem 0;border-top:1px solid var(--linha);text-align:left;vertical-align:middle}
.meteo-dias th{font-weight:400;white-space:nowrap}.meteo-maxmin,.meteo-dias .meteo-chuva{text-align:right;white-space:nowrap}
@media (max-width:480px){.meteo-cond-dia{display:none}}
.ic-tempo{display:block;overflow:visible}.ic-sol circle,.ic-raio{fill:#f2b33d}.ic-sol line{stroke:#f2b33d;stroke-width:3;stroke-linecap:round}
.ic-lua{fill:#e6dcb8}.ic-nuvem{fill:var(--nuvem)}.ic-nuvem2{fill:var(--nuvem2)}
.ic-gota{stroke:#3d7fb8;stroke-width:3;stroke-linecap:round}.ic-floco{fill:#7fb0dc;font:11px system-ui,sans-serif}
.ic-nevoeiro line{stroke:var(--nuvem2);stroke-width:3;stroke-linecap:round}
.mare{display:grid;grid-template-columns:8rem 1fr auto;gap:1rem;padding:.55rem 0;border-bottom:1px solid var(--linha)}
.tipo-mare.preia{color:var(--destaque);font-weight:600}
/* Calendário lunar: grelha de 7 colunas com a lua de cada dia; dias das fases principais e hoje realçados. */
/* Mês e ano como texto simples com a seta do menu dos países, centrada por baixo do texto (sem receber cliques). */
.escolha{position:relative;display:inline-flex;align-items:center;padding-bottom:.3rem}span.escolha::after{position:absolute;left:50%;bottom:.05rem;margin:0;transform:translateX(-50%) rotate(45deg);pointer-events:none}
.escolha select{appearance:none;-webkit-appearance:none;border:0;background:none;font:inherit;font-weight:600;color:var(--texto);padding:.2rem 0;text-align:center;text-align-last:center;cursor:pointer}
/* A lista fica com a largura do valor escolhido (não do mais comprido), para a seta ficar junto ao texto. */
.escolha select{field-sizing:content}@supports not (field-sizing:content){.escolha select{width:calc(var(--n) * .85ch + .2rem)}}
.escolha select:focus-visible{outline:1px solid var(--suave);outline-offset:2px}.escolha option{color:var(--texto);background:var(--fundo)}
.relogio{display:flex;align-items:center;gap:.6rem;min-width:0;font-size:.9rem;color:var(--suave)}.relogio[hidden]{display:none}@media (min-width:640px){.topo{position:relative}.relogio{position:absolute;left:50%;transform:translateX(-50%)}}@media (max-width:480px){.marca .marca-resto{display:none}.topo{gap:.5rem}.relogio{gap:.3rem}.relogio .fusos summary::after{margin-left:.25rem}}.relogio-hora{white-space:nowrap;font-weight:600;color:var(--texto);font-variant-numeric:tabular-nums}.fusos{min-width:0}.fusos summary{min-width:0}.relogio-cidade{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-lua{width:100%;border-collapse:collapse;table-layout:fixed;font-size:.85rem;margin:.5rem 0 1rem}
.cal-lua th{color:var(--suave);font-weight:400;padding:.3rem 0;text-align:center}
.cal-lua td{text-align:center;vertical-align:top;padding:.35rem .1rem;border-top:1px solid var(--linha);height:4.2rem}
.cal-lua svg{display:block;margin:.2rem auto 0}.dia-cal{color:var(--suave)}
.cal-lua .principal .dia-cal,.cal-lua .hoje .dia-cal{color:var(--texto);font-weight:600}
.cal-lua .hoje{background:color-mix(in srgb,var(--destaque) 12%,transparent)}
.fase-cal{display:block;font-size:.68rem;line-height:1.2;color:var(--destaque);margin-top:.15rem}
@media (max-width:480px){.fase-cal{display:none}}
/* Tábua de marés do mês: um dia por linha, preia-mar e baixa-mar com hora e altura. */
.tabua-titulo{font-size:1.15rem;margin:2.5rem 0 .25rem}
.tabua-mares{width:100%;border-collapse:collapse;font-size:.9rem;margin:.5rem 0 1rem}.tabua-mares td,.tabua-mares tbody th{font-variant-numeric:tabular-nums}
.tabua-mares th,.tabua-mares td{text-align:left;padding:.35rem .5rem .35rem 0;border-top:1px solid var(--linha);vertical-align:top}
.tabua-mares thead th{color:var(--suave);font-weight:400;border-top:0}.tabua-mares tbody th{font-weight:600;white-space:nowrap}
.tabua-mares .mare-hora{display:inline-block;margin-right:1rem;white-space:nowrap}
.tabua-mares tr.hoje{background:color-mix(in srgb,var(--destaque) 12%,transparent)}
/* Lista aberta com o estilo do site (Chrome 135+): centrada por baixo do mês ou do ano, sem a cor de destaque do sistema.
   Os outros navegadores mostram a lista nativa. */
@supports (appearance:base-select){
.escolha select,.escolha select::picker(select){appearance:base-select}
.escolha select{min-inline-size:0;border:0;background:none;gap:0}.escolha select::picker-icon{display:none}
.escolha select::picker(select){position-area:bottom center;margin-top:.35rem;max-block-size:16rem;padding:.3rem 0;border:1px solid var(--linha);border-radius:4px;background:var(--fundo);color:var(--texto);box-shadow:0 6px 20px rgb(0 0 0/.18);scrollbar-width:thin;scrollbar-color:var(--linha) transparent}
.escolha option{justify-content:center;padding:.3rem 1.25rem;font-weight:400;color:var(--suave);background:none}
.escolha option::checkmark{display:none}
.escolha option:checked{color:var(--texto);font-weight:600}
.escolha option:hover,.escolha option:focus-visible{color:var(--texto);background:color-mix(in srgb,var(--texto) 8%,transparent);outline:0}
/* Lista do fuso do relógio igual à dos países: por baixo, alinhada à esquerda, sem sombra nem cantos redondos, o fuso escolhido sublinhado. */
}
.escolha-local select{font:inherit;color:var(--texto);background:var(--fundo);border:1px solid var(--linha);border-radius:2px;padding:.35rem .5rem}.proximas{font-size:.9rem;font-weight:400;margin:.75rem 0 .25rem}
.botao-tema{display:inline-flex;align-items:center;background:none;border:0;padding:.2rem;color:var(--suave);cursor:pointer;align-self:center}.botao-tema:hover{color:var(--texto)}.botao-tema[hidden]{display:none}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fundo);color:var(--texto);font:1.0625rem/1.65 "Asap Sharp",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;overflow-wrap:break-word}
.coluna{max-width:860px;margin:0 auto;padding:0 1.25rem}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em;text-decoration-color:var(--suave)}
a:hover{text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--destaque);outline-offset:2px}
h1,h2,.serif{font-family:var(--titulos);font-weight:400;line-height:1.2}h1,h2{font-weight:600}
h1{font-size:clamp(2rem,6vw,2.75rem);margin:.25rem 0 1.25rem}
h2{font-size:1.5rem;margin:3rem 0 .75rem}
.suave{color:var(--suave);font-size:.9rem}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:-999px}.saltar:focus{left:1rem;top:1rem;background:var(--fundo);padding:.5rem}
/* Barra do topo (logótipo, procura, tema, país): sempre visível ao descer, tudo centrado na vertical. */
.barra-topo{position:sticky;top:0;z-index:10;background:var(--fundo);border-bottom:1px solid transparent;transition:border-color .2s,box-shadow .2s}
.barra-topo.com-sombra{border-bottom-color:var(--linha);box-shadow:0 2px 10px rgba(0,0,0,.06)}
/* Avisos meteorológicos: faixa por baixo da barra do topo (acompanha o scroll), separada por uma linha de lado a lado.
   Desliza sem saltos (a lista vem repetida e anda metade da largura); para com o rato ou o foco. Cores do MeteoAlarm. */
.avisos-linha{border-top:1px solid var(--linha)}.barra-topo.com-sombra:has(.avisos-linha){border-bottom-color:transparent}
.avisos-meteo{display:flex;align-items:center;gap:.75rem;padding:.35rem 0;font-size:.8rem;line-height:1.35}
.avisos-titulo{display:flex;align-items:center;gap:.35rem;flex:none;font-family:"Oxanium",system-ui,sans-serif;color:var(--suave)}
.avisos-janela{overflow:hidden;flex:1;-webkit-mask-image:linear-gradient(90deg,transparent,#000 2rem,#000 calc(100% - 2rem),transparent);mask-image:linear-gradient(90deg,transparent,#000 2rem,#000 calc(100% - 2rem),transparent)}
.avisos-faixa{display:inline-flex;white-space:nowrap;animation:avisos-correr var(--duracao,40s) linear infinite}
.avisos-lista{display:inline-flex}
.avisos-meteo:hover .avisos-faixa,.avisos-meteo:focus-within .avisos-faixa{animation-play-state:paused}
.aviso-item{color:var(--texto);text-decoration:none;padding-right:2.5rem}.aviso-item:hover strong{text-decoration:underline}
.nivel{display:inline-block;padding:0 .35rem;border-radius:3px;font-size:.7rem;font-weight:600;line-height:1.5;color:#141414}
.nivel.n2{background:#ffda22}.nivel.n3{background:#ff9300}.nivel.n4{background:#ff0000}
@keyframes avisos-correr{to{transform:translateX(-50%)}}
.avisos-grupo{margin:1rem 0;padding-bottom:.75rem;border-bottom:1px solid var(--linha)}.avisos-grupo h3{margin:0 0 .3rem;font-size:1rem}
.avisos-grupo .areas{margin:.2rem 0}.aviso-texto{white-space:pre-line;font-size:.92rem}.avisos-grupo details{margin:.4rem 0}.avisos-grupo summary{cursor:pointer;color:var(--suave)}
@media (prefers-reduced-motion:reduce){.avisos-faixa{animation:none}.avisos-janela{overflow-x:auto;-webkit-mask-image:none;mask-image:none}.avisos-lista.copia{display:none}}
.topo{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:.6rem;padding-bottom:.6rem}
header.coluna{padding-top:1rem}
/* Os saltos para secções (#feriados…) não ficam escondidos por baixo da barra. */
html{scroll-padding-top:4.5rem}
.marca{font-size:1.2rem;text-decoration:none;display:inline-flex;align-items:center;align-self:center}
/* Logótipo: um relógio cuja pena é o ponteiro; ao passar por cima (ou com o teclado) a pena dá uma volta e o nome aparece letra a letra. */
.marca-b{flex:none;--mostrador:#fbf7f2;--aro:var(--destaque);--tinta:#141414;--pena:#e8846f}
.marca-b .pena{transform-box:view-box;transform-origin:18px 18px;transform:rotate(45deg);transition:transform .9s ease}
.marca-resto{position:relative;display:inline-flex;max-width:0;overflow:hidden;margin-left:0;font-family:"Oxanium",system-ui,sans-serif;font-size:1.35rem;font-weight:800;letter-spacing:.05em;font-kerning:none;color:var(--apagado);transition:max-width .5s ease,margin .5s ease}
/* O nome, em cinzento, enche-se da cor de destaque da esquerda para a direita ao passar o rato (como os menus "encher"):
   uma cópia colorida por cima que cresce de 0 a 100%. Sem kerning, para as letras da cópia caírem por cima das outras. */
.marca-resto span:first-child{color:var(--destaque)}
.marca-resto::before{content:attr(data-texto);content:attr(data-texto) / "";position:absolute;top:0;bottom:0;left:0;width:0;overflow:hidden;white-space:nowrap;color:var(--destaque);transition:width 1s ease-in-out;pointer-events:none}
.marca:hover .marca-resto::before,.marca:focus-visible .marca-resto::before{width:100%}
.marca-resto span{opacity:0;transform:translateX(-.35em);transition:opacity .25s ease,transform .25s ease;transition-delay:calc(var(--i) * 70ms)}
/* A pena dá uma volta completa ao mostrador, como um ponteiro (parte da 1h30, onde está desenhada). */
.marca:hover .marca-b .pena,.marca:focus-visible .marca-b .pena{transform:rotate(405deg)}
/* Depois da primeira passagem (classe "aberta", posta por app.js), o nome fica aberto nesta página. */
.marca:hover .marca-resto,.marca:focus-visible .marca-resto,.marca.aberta .marca-resto{max-width:10rem;margin-left:.65rem}
.marca:hover .marca-resto span,.marca:focus-visible .marca-resto span,.marca.aberta .marca-resto span{opacity:1;transform:none}
/* Ecrãs táteis não têm "passar por cima": o nome fica sempre visível. */
@media (hover:none){.marca-resto{max-width:10rem;margin-left:.65rem}.marca-resto span{opacity:1;transform:none}}
/* Com "menos animações": sem rotação nem deslizamento; as letras continuam a aparecer uma a uma, só com opacidade. */
@media (prefers-reduced-motion:reduce){.marca-b .pena,.marca-resto,.marca-resto::before{transition:none}.marca-resto span{transform:none;transition:opacity .25s ease;transition-delay:calc(var(--i) * 70ms)}.marca:hover .marca-b .pena,.marca:focus-visible .marca-b .pena{transform:rotate(45deg)}}
.paises{position:relative;font-size:.9rem}
.filtros{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin:.9rem 0 1.5rem;font-size:.9rem;color:var(--suave)}.filtros select{font:inherit;color:var(--texto);background:var(--fundo);border:1px solid var(--linha);border-radius:2px;padding:.25rem .4rem;margin-left:.35rem}.filtros input{margin-left:.35rem;padding:.25rem .4rem}
.topo{position:relative}.procura{margin-left:auto;align-self:center}.procura summary{cursor:pointer;color:var(--suave);list-style:none;display:flex}.procura summary::-webkit-details-marker{display:none}.procura summary:hover,.procura[open] summary{color:var(--texto)}
.procura form{position:absolute;top:100%;right:0;z-index:3;width:min(24rem,100%);box-sizing:border-box;padding:.6rem;background:var(--fundo);border:1px solid var(--linha);border-top:0}.procura input{display:block;width:100%;box-sizing:border-box;margin:0;padding:.5rem .6rem;font-size:1rem;background:var(--fundo)}
.paises summary{cursor:pointer;color:var(--suave);list-style:none;display:flex;align-items:center;line-height:1}.paises summary::-webkit-details-marker{display:none}
/* Barra de cima maior em ecrãs largos (no telemóvel o espaço não chega). */
@media (min-width:640px){.topo{padding-top:.8rem;padding-bottom:.8rem}.marca-b{width:42px;height:42px}.marca-resto{font-size:1.65rem}.relogio{font-size:1.05rem}.procura summary svg,.botao-tema svg{width:20px;height:20px}.paises{font-size:1.05rem}}
/* Divisa fina (duas bordas rodadas): aponta para baixo; com o menu aberto, roda para cima. */
/* Área de toque ≥ 24 px (WCAG 2.5.8) nos controlos do topo, sem mudar o desenho: o padding alarga, a margem negativa compensa. */
.procura summary,.paises summary,.topo .botao-tema{padding:.5rem;margin:-.5rem}
.paises summary::after,.escolha::after{content:"";width:.38em;height:.38em;margin:-.22em 0 0 .45rem;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg);transition:transform .2s ease,margin .2s ease}
.paises[open] summary::after{transform:rotate(-135deg);margin-top:.18em}
/* Menu dos fusos do relógio: o mesmo dos países (seta, contorno, sublinhado no escolhido), centrado por baixo da cidade,
   com altura limitada e as cidades agrupadas por região. */
.fusos ul{right:auto;left:50%;transform:translateX(-50%);max-height:min(20rem,60vh);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--linha) transparent;text-align:left}
.fusos li.regiao{padding:.6rem 1rem .15rem;font-size:.8em;color:var(--suave)}
.fusos li button{display:block;width:100%;padding:.3rem 1rem;border:0;background:none;font:inherit;color:var(--texto);text-align:left;cursor:pointer}
.fusos li button:hover,.fusos li button:focus-visible{background:color-mix(in srgb,var(--texto) 8%,transparent);outline:0}
.fusos li button[aria-current]{text-decoration:underline}
@media (prefers-reduced-motion:reduce){.paises summary::after{transition:none}}
.paises ul{position:absolute;right:0;z-index:2;margin:.5rem 0 0;padding:.5rem 0;list-style:none;background:var(--fundo);border:1px solid var(--linha);min-width:12rem}
.paises li a{display:block;padding:.3rem 1rem;text-decoration:none}
.paises li a[aria-current]{text-decoration:underline}
.kicker{margin:3rem 0 0;color:var(--suave);font-size:.95rem}
nav.secoes{display:flex;flex-wrap:wrap;gap:.25rem 1.5rem;border-bottom:1px solid var(--linha);padding-bottom:.75rem}
nav.secoes a{text-decoration:none;color:var(--suave)}
/* Menus (principal, secções, temas e setas de dia, mês e ano) em Oxanium, a letra do nome no logótipo. */
nav.secoes a,nav.temas a,.navdia>a{font-family:"Oxanium",system-ui,sans-serif;font-weight:400}
nav.secoes a[aria-current]{color:var(--texto);text-decoration:underline;text-decoration-color:var(--destaque);text-decoration-thickness:2px;text-underline-offset:.45em}
#carregando{color:var(--suave);font-size:.85rem;min-height:1.5rem;margin:.5rem 0 0}
.intro{font-size:1.2rem;line-height:1.55;margin:1.5rem 0}
.intro p{margin:0 0 .5rem}.intro ul{list-style:"•  ";margin:0 0 .5rem;padding-left:1.4rem}.intro li{margin:.3rem 0}.intro li::marker{color:var(--destaque)}
.lista{list-style:none;padding:0;margin:0}
.lista>li{padding:.85rem 0;border-top:1px solid var(--linha)}
.lista>li:last-child{border-bottom:1px solid var(--linha)}
.entrada{display:grid;grid-template-columns:4.25rem 1fr;gap:1rem}.por-confirmar{margin:1.5rem 0 .5rem;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em}.entrada.do-ano{background:color-mix(in srgb,var(--destaque) 8%,transparent);box-shadow:-.5rem 0 0 color-mix(in srgb,var(--destaque) 8%,transparent),inset 3px 0 var(--destaque)}
/* Listas longas recolhidas (dia.ejs + app.js): a última entrada à vista leva a linha de baixo. */
.js .recolher:not(.aberta) .extra{display:none}.js .recolher:not(.aberta) .lista>li:has(+.extra){border-bottom:1px solid var(--linha)}
.mais{display:inline-block;padding:.25rem 0}
.ver-mais{display:block;width:100%;min-height:2.75rem;margin:.75rem 0 0;color:var(--suave)}
.ano{font-size:1.15rem;font-variant-numeric:tabular-nums;line-height:1.45}
.destaque .ano{color:var(--destaque)}
.entrada p{margin:0}
.entrada a{font-size:.8rem;color:var(--suave)}
.navdia{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin:1.5rem 0}
.navdia>a{text-decoration:none;color:var(--suave)}.navdia>a:hover{color:var(--texto)}
form.linha{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;position:relative}
.calendario{display:inline-flex;align-items:center;padding:.4rem .45rem}.calendario[hidden]{display:none}
.seletor-data{position:absolute;left:0;bottom:0;width:1px;height:1px;padding:0;border:0;opacity:0;pointer-events:none}
input,button{font:inherit;font-size:.95rem;color:inherit;background:transparent;border:1px solid var(--linha);border-radius:2px;padding:.35rem .6rem}
button{cursor:pointer}button:hover{border-color:var(--suave)}
input[type=email]{flex:1;min-width:12rem}
.titulo-noticia{font-size:1.2rem;line-height:1.35;margin:0 0 .35rem}
.titulo-noticia a{text-decoration:none}.titulo-noticia a:hover{text-decoration:underline}
.arquivo{display:flex;gap:.6rem;align-items:center;margin-top:.5rem;font-size:.85rem;text-decoration:none}.arquivo:hover span{text-decoration:underline}.arquivo img{flex:none;width:56px;height:56px;object-fit:cover;border-radius:2px;background:var(--linha)}
.fontes-noticia{margin:0;color:var(--suave);font-size:.88rem}.fontes-noticia summary{cursor:pointer}.fontes-noticia p{margin:.35rem 0 0}
.barra{display:inline-block;width:5rem;height:.3rem;background:var(--linha);border-radius:.15rem;vertical-align:middle;margin-right:.5rem;overflow:hidden}.barra>span{display:block;height:100%;background:var(--destaque)}
nav.temas{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;margin:1rem 0}nav.temas a{color:var(--suave);text-decoration:none}nav.temas a[aria-current]{color:var(--texto);text-decoration:underline;text-decoration-color:var(--destaque);text-underline-offset:.35em}
/* Ligações "encher" (menus das secções e dos temas, setas de dia, mês e ano): ao passar o rato, a palavra enche-se da cor de
   destaque da esquerda para a direita. Uma cópia colorida do texto (data-texto) por cima, que cresce de 0 a 100% de largura. */
.encher{position:relative;white-space:nowrap}.encher:not([aria-current]),.navdia>a.encher:hover{color:var(--apagado)}
.encher::before{content:attr(data-texto);content:attr(data-texto) / "";position:absolute;top:0;bottom:0;left:0;width:0;overflow:hidden;white-space:nowrap;color:var(--destaque);transition:width .5s ease-in-out;pointer-events:none}
.encher:hover::before,.encher:focus-visible::before{width:100%}
@media (prefers-reduced-motion:reduce){.encher::before{transition:none}}
.fontes-noticia a{color:var(--texto)}
.unica{color:var(--suave)}
.verificacao{margin:.35rem 0 0;font-size:.88rem}.verificacao strong{color:var(--destaque);font-weight:600}
.filtro{margin:1.5rem 0;font-size:.95rem}
/* Interruptor (como o "Flat UI checkbox" do CodePen): a caixa fica escondida, mas acessível ao teclado (Tab e espaço);
   mostra-se uma barra em que o quadrado desliza para a direita quando está ligado. ✕ desligado, ✓ ligado. */
.interruptor{display:inline-flex;align-items:center;gap:.75rem;cursor:pointer}
.interruptor input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.interruptor .ui{position:relative;flex:none;width:80px;height:30px;border-radius:6px;background:var(--linha);transition:background-color .2s}
.interruptor .ui::before{content:"";position:absolute;top:0;left:0;width:30px;height:30px;border-radius:6px 0 0 6px;background:var(--apagado);transition:all .2s}
.interruptor .ui::after{content:"✕";position:absolute;top:0;left:30px;width:50px;line-height:30px;text-align:center;font-size:14px;font-weight:700;color:var(--apagado);transition:all .2s}
.interruptor input:checked+.ui{background:var(--destaque)}
.interruptor input:checked+.ui::before{left:50px;border-radius:0 6px 6px 0;background:var(--fundo);box-shadow:inset 0 0 0 2px var(--destaque)}
.interruptor input:checked+.ui::after{content:"✓";left:0;color:var(--fundo)}
.interruptor input:focus-visible+.ui{outline:2px solid var(--destaque);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.interruptor .ui,.interruptor .ui::before,.interruptor .ui::after{transition:none}}
.so-confirmadas li[data-n="1"]{display:none}
.indice{columns:2;column-gap:2rem;list-style:none;padding:0}.indice li{padding:.2rem 0}
.simples{padding-left:1.1rem}
.bloco{margin:3rem 0;padding-top:1rem;border-top:1px solid var(--linha)}
.bloco h2{font-size:1.15rem;margin:0 0 .5rem}
.anuncio{margin:2.5rem 0;padding:1rem 0;border-top:1px solid var(--linha);border-bottom:1px solid var(--linha)}
.anuncio p{margin:0 0 .5rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}
footer{margin:4rem auto 3rem;color:var(--suave);font-size:.9rem}
/* Rodapé: links à esquerda, redes sociais ao centro da página (por baixo dos links nos ecrãs estreitos) */
footer nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:.75rem 1.25rem;margin:1.5rem 0}
.ligacoes{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem}.ligacoes a{padding:.15rem 0}
@media (max-width:560px){footer nav{grid-template-columns:1fr}footer nav .redes{justify-self:center}.ligacoes{justify-content:center}}
/* Línguas do país (Suíça: FR · DE · IT), por cima do criador */
.edicoes{display:flex;justify-content:center;align-items:center;gap:.35rem;margin:0 0 1rem;font-size:.85rem}.edicoes a{color:var(--suave)}.edicoes .atual{color:var(--texto);font-weight:600}
.bandeira svg{display:block;height:.8rem;width:auto}
/* Última linha: criador do site */
.creditos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.25rem 1.5rem;margin:0;font-size:.85rem;color:var(--apagado)}
.creditos a{color:var(--suave)}
/* Redes sociais: os ícones espreitam por cima de uma linha e sobem ao passar o rato (no telemóvel ficam inteiros) */
.redes{display:flex;gap:0 .9rem;height:1.75rem;overflow:clip;margin:0 0 .35rem;padding:0 .5rem;list-style:none;border-bottom:1px solid var(--linha)}
.rede{display:block;position:relative;top:.6rem;transition:top .1s cubic-bezier(.42,0,.58,1)}.rede svg{display:block;width:1.5rem;height:1.5rem}
.rede:hover,.rede:focus-visible{top:.15rem}@media (hover:none){.rede{top:.15rem}}@media (prefers-reduced-motion:reduce){.rede{transition:none}}
.redes .rede-instagram{color:#fff}.rede-instagram svg{padding:.2rem;box-sizing:border-box;border-radius:22%;background:#d6249f;background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%)}
.redes .rede-facebook{color:#3B5998}.redes .rede-x{color:var(--texto)}.redes .rede-email{color:var(--destaque)}
/* Buy Me a Coffee: chávena preta em fundo amarelo (o amarelo sozinho não se vê no fundo claro). */
.redes .rede-buymeacoffee{color:#000}.rede-buymeacoffee svg{padding:.2rem;box-sizing:border-box;border-radius:22%;background:#fd0}.redes .rede-patreon{color:#ff424d}
@media (prefers-color-scheme:dark){:root:not([data-tema=claro]) .redes .rede-facebook{color:#5b7bd5}}:root[data-tema=escuro] .redes .rede-facebook{color:#5b7bd5}
.convite{position:fixed;left:1.25rem;bottom:1.25rem;z-index:6;width:min(22rem,calc(100% - 2rem));box-sizing:border-box;padding:1rem 1.25rem;background:var(--fundo);border:1px solid var(--linha);border-radius:10px;box-shadow:0 12px 40px rgba(0,0,0,.25);font-size:.95rem}.convite[hidden]{display:none}
.convite p{margin:0 0 .75rem}.convite .convite-titulo{font-weight:600;padding-right:2rem}.convite form{margin:0}.convite input[type=email]{flex:1;min-width:0}
.convite-fechar{position:absolute;top:.5rem;right:.5rem;display:flex;padding:.35rem;border:0;background:none;color:var(--suave);cursor:pointer}.convite-fechar:hover,.convite-fechar:focus-visible{color:var(--texto)}
@media (max-width:480px){.convite{left:1rem;right:1rem;bottom:1rem;width:auto}}
@media (prefers-reduced-motion:no-preference){.convite{animation:convite-entra .35s ease-out}@keyframes convite-entra{from{opacity:0;transform:translateY(1rem)}}}
.cookies{position:fixed;left:0;right:0;bottom:0;background:var(--fundo);border-top:1px solid var(--linha);padding:1rem}
.cookies p{margin:0 0 .5rem}
@media (max-width:480px){.entrada{grid-template-columns:3.5rem 1fr;gap:.75rem}.indice{columns:1}}
@media (prefers-reduced-motion:no-preference){a,button{transition:color .15s,border-color .15s}}