/* Hip Hop no Mapa: o site é o encarte de uma coletânea. Papel, tinta preta e uma cor de serigrafia (o laranja do CD). */
:root{
  --papel:#efe6d3; --papel-2:#e5dac2; --papel-3:#f6f0e3;
  --tinta:#17140f; --tinta-2:#4a4338; --tinta-3:#6d6455;
  --laranja:#e4441d; --laranja-tinta:#a5361a; --laranja-claro:#ff8a63;
  --linha:rgba(23,20,15,.42);
  --display:'Big Shoulders Display','Archivo Narrow',sans-serif;
  --texto:'Archivo',system-ui,sans-serif;
  --dado:'IBM Plex Mono',ui-monospace,monospace;
  --gutter:20px; --barra:68px; --escala:1;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--tinta) var(--papel-2);scrollbar-width:auto}
/* barra de rolagem no visual do encarte */
::-webkit-scrollbar{width:14px;height:14px}
::-webkit-scrollbar-track{background:var(--papel-2)}
::-webkit-scrollbar-thumb{background:var(--tinta);border:4px solid var(--papel-2);border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:var(--laranja-tinta)}
::-webkit-scrollbar-corner{background:var(--papel-2)}
/* grão do papel: textura parada no fundo, pintada uma vez */
body{--grao:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .4 0 0 0 0 .35 0 0 0 0 .3 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  background:var(--papel) var(--grao);color:var(--tinta);font:400 16px/1.5 var(--texto);min-height:100vh;overflow-x:hidden;accent-color:var(--laranja-tinta);
  padding-bottom:calc(var(--barra) + env(safe-area-inset-bottom))}
::selection{background:var(--laranja);color:var(--papel-3)}
a{color:inherit;text-decoration-thickness:1.5px;text-underline-offset:3px}
a:hover{color:var(--laranja-tinta)}
:focus-visible{outline:2.5px solid var(--tinta);outline-offset:3px;border-radius:3px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pular{position:absolute;left:var(--gutter);top:-60px;z-index:60;background:var(--tinta);color:var(--papel);padding:10px 14px;border-radius:6px;text-decoration:none}
.pular:focus{top:12px}

/* abas: barra escura embaixo no celular, no topo no computador */
.marca{display:none}
.abas{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(6,1fr);background:var(--tinta);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -10px 24px -14px rgba(23,20,15,.55)}
.abas a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:56px;border-radius:12px;
  color:#cfc4ae;text-decoration:none;font:600 10.5px/1 var(--texto);transition:color .15s,background-color .15s}
.abas svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.abas a[aria-current="page"]{color:var(--laranja-claro);background:rgba(239,230,211,.08)}
.abas a:hover{color:var(--papel-3)}
.abas a:focus-visible{outline-color:var(--papel-3)}

/* botões */
.botao{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:999px;border:0;
  background:var(--tinta);color:var(--papel-3);font:700 15px/1 var(--texto);text-decoration:none;cursor:pointer;transition:transform .15s ease-out,background-color .15s}
.botao:hover{color:var(--papel-3);background:#2c261d}
.botao:active{transform:translateY(1px)}
.botao--linha{background:transparent;color:var(--tinta);box-shadow:inset 0 0 0 2px var(--tinta)}
.botao--linha:hover,.botao--linha[aria-pressed="true"]{background:var(--tinta);color:var(--papel-3)}
.botao[aria-busy="true"]{opacity:.6;cursor:progress}
.botao:disabled{opacity:.45;cursor:not-allowed}

/* páginas */
.pagina{padding:0 var(--gutter) 48px;animation:entra .45s cubic-bezier(.16,1,.3,1)}
@keyframes entra{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.pagina-titulo{font:900 clamp(64px,19vw,120px)/.92 var(--display);text-transform:uppercase;padding-top:52px;text-wrap:balance}
.pagina-sub{margin-top:14px;max-width:46ch;font:500 13px/1.5 var(--dado);color:var(--tinta-2)}

/* o CD: rótulo impresso gira (svg), sulcos e reflexo ficam parados por cima (::after) */
.disco{position:relative;display:block;border-radius:50%;aspect-ratio:1;box-shadow:-8px 16px 30px -12px rgba(60,20,0,.45)}
.disco::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
  background:
    conic-gradient(from 12deg,rgba(255,255,255,0) 0deg,rgba(255,255,255,.26) 22deg,rgba(255,255,255,0) 52deg,rgba(255,255,255,0) 178deg,rgba(255,255,255,.2) 200deg,rgba(255,255,255,0) 232deg,rgba(255,255,255,0) 360deg),
    repeating-radial-gradient(circle,rgba(23,20,15,0) 0 2.2px,rgba(23,20,15,.09) 2.2px 3px,rgba(255,255,255,.07) 3px 3.6px);
  -webkit-mask:radial-gradient(circle,transparent 0 11.4%,#000 11.8%);mask:radial-gradient(circle,transparent 0 11.4%,#000 11.8%)}
.disco-svg{display:block;width:100%;height:100%;overflow:visible;transform-origin:50% 50%;will-change:transform}
.cidade-ponto{cursor:pointer}
.cidade-ponto:focus{outline:none}
.cidade-ponto:focus-visible .alvo,.cidade-ponto[aria-pressed="true"] .alvo{stroke:var(--papel-3);stroke-width:4}

/* hoje */
.pg-hoje{position:relative;overflow:hidden}
.capa{position:relative;z-index:2;padding:58px 0 30px;min-height:410px;pointer-events:none}   /* o texto não pode tampar o toque no CD */
.capa .onde,.capa .onde-aviso,.capa .filtro-capa,.capa a,.capa button,.capa select{pointer-events:auto}
.disco--capa{position:absolute;width:330px;right:-128px;top:40px;z-index:1;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.disco--capa.aberto{transform:translateX(-150px) scale(1.05);z-index:3}   /* o CD sai da borda e mostra o Brasil inteiro */
.dica-capa .so-pc{display:none}
.capa-titulo{font:900 clamp(78px,23vw,112px)/.8 var(--display);text-transform:uppercase;letter-spacing:-.005em;max-width:9ch}
.capa-sub{margin-top:18px;max-width:22ch;font:500 13px/1.45 var(--dado)}
.onde{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.onde-uf select,.filtros select,.filtros input,.campo input,.campo select,.campo textarea{font:500 15px/1.2 var(--texto);color:var(--tinta);background:var(--papel-3);
  border:2px solid var(--tinta);border-radius:999px;min-height:46px;padding:0 38px 0 16px;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2317140f' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
.filtros input,.campo input,.campo textarea{background-image:none;padding-right:16px}
.filtro-capa{margin-top:12px;display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;background:var(--tinta);color:var(--papel-3);border-radius:10px;padding:8px 12px;font-size:14px}
.filtro-capa .link{color:var(--laranja-claro);background:none;border:0;font:600 12.5px/1.2 var(--dado);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.dica-capa{margin-top:12px;max-width:22ch;font:500 12px/1.45 var(--dado);color:var(--tinta-2)}
.onde-aviso{margin-top:10px;font:500 13px/1.4 var(--dado);color:var(--laranja-tinta);max-width:34ch}

.lado-cab{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-top:2.5px solid var(--tinta);padding-top:10px;margin-bottom:4px}
.lado-cab h2{font:900 28px/1 var(--display);text-transform:uppercase;letter-spacing:.005em}
.lado-marca{font:500 12px/1 var(--dado);color:var(--tinta-2);white-space:nowrap}
.lado-link{font:600 13px/1 var(--dado);white-space:nowrap}
.bloco-hoje{position:relative;z-index:2;background:var(--tinta);color:var(--papel);border-radius:16px;padding:18px 18px 6px}
.bloco-hoje .lado-cab{border-top:0;padding-top:0}
.bloco-hoje .lado-marca{color:#bdb19a}
.bloco-hoje .faixa{border-bottom-color:rgba(239,230,211,.2)}
.bloco-hoje .faixas li:last-child .faixa{border-bottom:0}
.bloco-hoje .faixa-n{color:var(--laranja-claro)}
.bloco-hoje .faixa-onde,.bloco-hoje .vazio{color:#cfc4ae}
.bloco-hoje .selo{color:#ffa384}
.bloco-hoje a,.bloco-hoje .vazio strong{color:var(--papel-3)}
.bloco-hoje a.faixa:hover .faixa-nome{color:#ffa384}
.bloco-hoje :focus-visible{outline-color:var(--papel-3)}
.bloco-amanha{margin-top:44px}

/* faixas */
.faixas{list-style:none}
.faixa{display:grid;grid-template-columns:34px 1fr auto;column-gap:8px;align-items:baseline;padding:11px 0 12px;border-bottom:1px dotted var(--linha);text-decoration:none;color:inherit}
a.faixa:hover .faixa-nome{color:var(--laranja-tinta)}
.faixa-n{font:500 12px/1.6 var(--dado);color:var(--laranja-tinta)}
.faixa-nome{font:700 17px/1.25 var(--texto);transition:color .15s}
.faixa-h{font:600 16px/1.3 var(--dado);font-variant-numeric:tabular-nums;text-align:right}
.faixa-onde{grid-column:2 / 4;font:400 13.5px/1.4 var(--texto);color:var(--tinta-2);margin-top:2px}
.selo{display:inline-block;font:500 11px/1.2 var(--dado);color:var(--laranja-tinta);margin-left:6px;white-space:nowrap}
.selo--vivo{color:var(--papel-3);background:var(--laranja);padding:3px 6px 2px;border-radius:3px;margin-left:0;margin-right:6px;vertical-align:1px}
.dia-cab{font:700 14px/1 var(--texto);margin:22px 0 2px;color:var(--tinta-2)}
.vazio{padding:16px 0 6px;color:var(--tinta-2);max-width:40ch}
.vazio strong{color:var(--tinta)}
.nota{font:500 13px/1.45 var(--dado);color:var(--tinta-2);margin:8px 0 0}

.chamada{margin-top:48px;background:var(--tinta);color:var(--papel);border-radius:16px;padding:26px 22px 24px}
.chamada h2{font:900 40px/.9 var(--display);text-transform:uppercase;max-width:9ch}
.chamada p{margin:12px 0 20px;color:#d9cfbb;max-width:44ch;font-size:15px}
.chamada .botao{background:var(--laranja);color:var(--tinta)}
.chamada .botao:hover{background:#f05a33;color:var(--tinta)}

/* notícias e o quadro do Nacional */
.nacional{margin-top:30px;background:var(--papel-2);border-radius:16px;padding:18px 18px 8px}
.nacional .lado-cab{border-top:0;padding-top:0}
.nacional-info{font-size:14.5px;color:var(--tinta-2);margin:6px 0 4px;max-width:60ch}
.estados{list-style:none}
.estado{padding:13px 0;border-bottom:1px dotted var(--linha)}
.estado:last-child{border-bottom:0}
.estado-cab{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.estado-cab b{font:900 23px/1 var(--display);text-transform:uppercase}
.selo--vaga{color:var(--papel-3);background:var(--tinta);padding:3px 7px 2px;border-radius:3px;margin-left:0}
.estado-org{font-size:14.5px;margin-top:5px}
.estado-org a,.vagas a{font:500 12.5px/1 var(--dado)}
.estado-etapa{font:500 12.5px/1.45 var(--dado);color:var(--laranja-tinta);margin-top:4px}
.vagas{list-style:none;margin-top:8px;display:grid;gap:5px;font-size:15px}
.feed{margin-top:40px}
.noticia{padding:16px 0 18px;border-bottom:1px dotted var(--linha)}
.noticia-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font:500 12px/1 var(--dado);color:var(--tinta-2)}
.noticia-tag{color:var(--papel-3);background:var(--laranja-tinta);padding:4px 7px 3px;border-radius:3px;text-transform:uppercase;letter-spacing:.04em}
.noticia h3{font:900 30px/.95 var(--display);text-transform:uppercase;margin-top:10px;text-wrap:balance}
.noticia p{margin-top:8px;max-width:62ch;color:var(--tinta-2)}
.noticia .lado-link{display:inline-block;margin-top:10px}
.bloco-noticias{margin-top:44px}
.bloco-noticias .noticia h3{font-size:25px}
/* semana */
.dias-semana{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding:22px 0 4px}
.dias-semana::-webkit-scrollbar{display:none}
.dia-chip{flex:1 0 54px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 4px 8px;border:0;border-radius:12px;
  box-shadow:inset 0 0 0 2px var(--tinta);background:transparent;color:var(--tinta);cursor:pointer;font:500 11.5px/1.1 var(--dado);transition:background-color .15s}
.dia-chip b{font:900 28px/1 var(--display)}
.dia-chip small{font:600 12px/1 var(--dado);color:var(--laranja-tinta)}
.dia-chip:hover:not(:disabled){background:var(--papel-2)}
.dia-chip[aria-pressed="true"]{background:var(--tinta);color:var(--papel-3)}
.dia-chip[aria-pressed="true"] small{color:var(--laranja-claro)}
.dia-chip:disabled{opacity:.35;cursor:default}

/* mapa: busca, filtros e o nome da cidade ao passar o mouse */
.mapa-filtros{display:grid;gap:10px;margin-top:20px;max-width:560px}
.mapa-busca input,.mapa-linha select{width:100%;font:500 15px/1.2 var(--texto);color:var(--tinta);background:var(--papel-3);border:2px solid var(--tinta);border-radius:999px;min-height:46px;padding:0 16px;appearance:none;-webkit-appearance:none}
.mapa-linha select{padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2317140f' stroke-width='2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.mapa-busca input::placeholder{color:var(--tinta-3)}
.mapa-dias{display:flex;flex-wrap:wrap;gap:6px;padding:2px 0}
.mapa-dias::-webkit-scrollbar{display:none}
.chip{flex:none;min-height:38px;padding:0 13px;border:0;border-radius:999px;box-shadow:inset 0 0 0 2px var(--tinta);background:transparent;color:var(--tinta);font:600 13px/1 var(--dado);cursor:pointer}
.chip:hover{background:var(--papel-2)}
.chip[aria-pressed="true"]{background:var(--tinta);color:var(--papel-3)}
.mapa-linha{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}
.mapa-conf{display:flex;gap:8px;align-items:center;font-size:14px;cursor:pointer;white-space:nowrap}
.mapa-conf input{width:19px;height:19px}
.mapa-dica{position:absolute;z-index:3;transform:translate(-50%,calc(-100% - 14px));pointer-events:none;background:var(--tinta);color:var(--papel-3);font:600 12.5px/1.2 var(--texto);padding:7px 10px;border-radius:8px;white-space:nowrap;box-shadow:0 6px 14px -6px rgba(23,20,15,.5)}
/* mapa */
.disco--mapa{width:min(100%,520px);margin:24px auto 0;transform:translateX(60%) rotate(80deg);opacity:.001;transition:transform 1.2s cubic-bezier(.16,1,.3,1),opacity .4s}
.disco--mapa.fora{transform:none;opacity:1}
/* celular: título, busca, CD e lista nessa ordem (o bloco da direita do computador se desmancha aqui) */
.pg-mapa{display:flex;flex-direction:column}
.mapa-lado{display:contents}
.pg-mapa>.pagina-titulo{order:1}.pg-mapa>.pagina-sub{order:2}.mapa-filtros{order:3}.pg-mapa>.disco--mapa{order:4}.cidade{order:5}
.cidade{margin-top:22px}
.cidade-cab{font:900 26px/1.05 var(--display);text-transform:uppercase;margin-bottom:2px;border-top:2.5px solid var(--tinta);padding-top:12px}
.cidade-cab small{display:block;font:500 12px/1.4 var(--dado);text-transform:none;color:var(--tinta-2);margin-top:4px}

/* todas as batalhas */
.filtros{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
.filtros label{display:flex;flex-direction:column;gap:5px;font:500 12px/1 var(--dado);color:var(--tinta-2)}
.filtros label:first-child{grid-column:1 / -1}
.filtros input::placeholder{color:var(--tinta-3)}
.contagem{font:500 12.5px/1.4 var(--dado);color:var(--tinta-2);margin-top:14px}
#discos{margin-top:12px;border-top:2.5px solid var(--tinta)}
.disco-grupo{border-bottom:1.5px solid var(--tinta)}
.disco-grupo summary{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 2px;cursor:pointer;list-style:none}
.disco-grupo summary::-webkit-details-marker{display:none}
.disco-grupo summary:hover .disco-nome{color:var(--laranja-tinta)}
.disco-nome{font:900 25px/1 var(--display);text-transform:uppercase;transition:color .15s}
.disco-qtd{display:flex;align-items:center;gap:12px;font:500 12px/1 var(--dado);color:var(--tinta-2);white-space:nowrap}
.disco-qtd::after{content:"";width:9px;height:9px;border-right:2px solid var(--tinta);border-bottom:2px solid var(--tinta);transform:translateY(-3px) rotate(45deg);transition:transform .2s ease-out}
.disco-grupo[open] .disco-qtd::after{transform:translateY(2px) rotate(225deg)}
.disco-grupo .faixas{padding:0 0 14px}
.bonus{margin-top:48px}

/* faixa e cadastro */
.pg-faixa,.pg-cadastro{max-width:760px;margin:0 auto;padding-top:20px}
.voltar{display:inline-flex;align-items:center;gap:8px;font:500 13px/1 var(--dado);text-decoration:none;padding:10px 0;color:var(--tinta-2)}
.voltar svg{width:16px;height:16px}
.ficha-titulo{font:900 clamp(56px,17vw,96px)/.92 var(--display);text-transform:uppercase;margin-top:22px;text-wrap:balance}
.ficha-linha{font:500 13px/1.5 var(--dado);color:var(--tinta-2);margin-top:12px}
.ficha{margin-top:24px;border-top:2.5px solid var(--tinta)}
.ficha div{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:13px 0;border-bottom:1px dotted var(--linha)}
.ficha dt{font:500 12px/1.6 var(--dado);color:var(--laranja-tinta)}
.ficha dd{font:500 16px/1.45 var(--texto)}
.ficha dd .hora{font:600 22px/1.2 var(--dado);font-variant-numeric:tabular-nums}
.ficha dd small{display:block;font-size:13.5px;color:var(--tinta-2);margin-top:3px}
.canais{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.canal svg{width:18px;height:18px}
.aviso{margin-top:22px;padding:14px 16px;border-radius:10px;background:var(--papel-2);font-size:14.5px;color:var(--tinta-2);max-width:60ch}
.aviso strong{color:var(--tinta)}
.ficha-acoes{margin-top:26px;display:flex;flex-wrap:wrap;gap:10px}
.form{margin-top:20px;display:grid;gap:18px}
.campo{display:flex;flex-direction:column;gap:7px}
.campo>span,.campo legend{font:700 14.5px/1.2 var(--texto)}
.campo small{font-size:13px;color:var(--tinta-2)}
.campo input,.campo select{border-radius:10px;width:100%;min-width:0}
.duplo>*{min-width:0}
.campo textarea{border-radius:10px;padding:12px 16px;min-height:96px;resize:vertical;line-height:1.45}
.campo [aria-invalid="true"]{border-color:var(--laranja-tinta);background-color:#f8e6dc}
.erro{font:500 13px/1.3 var(--texto);color:var(--laranja-tinta)}
.duplo{display:grid;grid-template-columns:1fr 1fr;gap:12px}
fieldset.campo{border:0}
.dias{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.dias label{position:relative}
.dias input{position:absolute;opacity:0;inset:0;cursor:pointer}
.dias span{display:inline-flex;align-items:center;justify-content:center;min-width:52px;min-height:42px;padding:0 10px;border-radius:999px;box-shadow:inset 0 0 0 2px var(--tinta);font:600 14px/1 var(--dado)}
.dias input:checked+span{background:var(--tinta);color:var(--papel-3)}
.dias input:focus-visible+span{outline:2.5px solid var(--laranja-tinta);outline-offset:2px}
.grupo-titulo{font:900 24px/1 var(--display);text-transform:uppercase;border-top:2.5px solid var(--tinta);padding-top:12px;margin-top:10px}
.aceite{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.4;cursor:pointer}
.aceite input{width:20px;height:20px;margin-top:1px;flex:none}
/* caixa de cidade própria (no lugar da lista do navegador) */
.cb{position:relative;width:100%}
.cb input{width:100%}
.cb-lista{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);max-height:300px;overflow:auto;list-style:none;background:var(--papel-3);
  border:2px solid var(--tinta);border-radius:12px;padding:6px;box-shadow:0 18px 30px -16px rgba(23,20,15,.45);scrollbar-width:thin}
.cb-lista::-webkit-scrollbar{width:10px}
.cb-lista::-webkit-scrollbar-thumb{border-width:3px;border-color:var(--papel-3)}
.cb-lista::-webkit-scrollbar-track{background:var(--papel-3)}
.cb-lista [role="option"]{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;cursor:pointer;font-size:15px}
.cb-lista [role="option"] b{font:600 12px/1 var(--dado);color:var(--tinta-2)}
.cb-lista [role="option"]:hover{background:var(--papel-2)}
.cb-lista [role="option"][aria-selected="true"]{background:var(--tinta);color:var(--papel-3)}
.cb-lista [role="option"][aria-selected="true"] b{color:#d9cfbb}
.cb-lista mark{background:none;color:inherit;text-decoration:underline;text-decoration-color:var(--laranja);text-decoration-thickness:2px;text-underline-offset:3px}
.cb-aviso{padding:10px 12px;font:500 12.5px/1.4 var(--dado);color:var(--tinta-2)}
.link-estado{font:500 12.5px/1.4 var(--dado)}
.link-estado--ok{color:#2f6b3a}
.link-estado--erro{color:var(--laranja-tinta)}
.previa{margin-top:6px;padding:4px 16px 8px;background:var(--papel-3);border-radius:12px;box-shadow:0 1px 0 var(--linha)}
.previa .faixa{border-bottom:0}
.estado-envio{padding:14px 16px;border-radius:10px;background:var(--tinta);color:var(--papel);font-size:15px}

.rodape{padding:30px 0 40px;border-top:2.5px solid var(--tinta);margin:0 var(--gutter);font-size:14px;color:var(--tinta-2);display:grid;gap:10px}
.rodape strong{color:var(--tinta)}
.rodape p{max-width:62ch}
.credito{font:500 12.5px/1 var(--dado);margin-top:6px}

/* computador: abas no topo, conteúdo em duas colunas onde cabe */
@media (min-width:980px){
  :root{--gutter:48px}
  body{padding-bottom:0}
  .topo{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:12px max(var(--gutter),calc(50% - 660px + var(--gutter)));
    background:var(--papel) var(--grao);border-bottom:2px solid var(--tinta)}
  .marca{display:block;font:900 26px/1 var(--display);text-transform:uppercase;text-decoration:none}
  .abas{position:static;display:flex;gap:4px;background:none;padding:0;box-shadow:none}
  .abas a{flex-direction:row;gap:8px;min-height:42px;padding:0 14px;border-radius:999px;color:var(--tinta);font-size:14.5px}
  .abas svg{width:19px;height:19px}
  .abas a:hover{color:var(--laranja-tinta)}
  .abas a[aria-current="page"]{background:var(--tinta);color:var(--papel-3)}
  .abas a[data-aba="cadastrar"]:not([aria-current="page"]){box-shadow:inset 0 0 0 2px var(--tinta)}
  .pagina{max-width:1320px;margin:0 auto}
  .pg-hoje{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.9fr);column-gap:64px;overflow:visible}
  .capa{padding-top:56px;min-height:0}
  .capa-titulo{font-size:148px;max-width:none}
  .capa-sub{font-size:14px;max-width:30ch}
  /* o CD cabe sempre inteiro na altura da tela; dividir pela escala compensa o zoom das telas grandes */
  .dica-capa .so-pc{display:inline}.dica-capa .so-celular{display:none}
  .disco--capa.aberto{transform:none}
  .disco--capa{position:sticky;top:96px;align-self:start;width:100%;max-width:min(560px,calc((100vh - 130px) / var(--escala)));justify-self:center;right:auto;margin-top:56px}
  .bloco-hoje{margin-top:8px}
  /* mapa no computador: título e CD à esquerda; busca, filtros e a lista da cidade à direita */
  .pg-mapa{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);grid-template-rows:auto auto 1fr;column-gap:56px;align-items:start;
    grid-template-areas:"titulo lado" "sub lado" "disco lado"}
  .pg-mapa>.pagina-titulo{grid-area:titulo}
  .pg-mapa>.pagina-sub{grid-area:sub}
  .pg-mapa>.disco--mapa{grid-area:disco}
  .mapa-lado{display:block;grid-area:lado;position:sticky;top:96px;padding-top:56px}
  .mapa-lado .mapa-filtros{margin-top:0}
  .disco--mapa{width:min(100%,max(300px,calc((100vh - 330px) / var(--escala))));margin:28px 0 0}
  .mapa-lado .cidade{margin-top:26px}
  .pg-semana .dias-semana{max-width:720px}
  .pg-semana #lista-prox,.pg-batalhas>*,.pg-noticias>*{max-width:860px}
  .faixa-nome{font-size:18px}
  .chamada{padding:34px 34px 30px}
  .chamada h2{font-size:52px}
  .rodape{max-width:1224px;margin:0 auto}
}
@media (min-width:980px) and (max-width:1320px){.rodape{margin:0 var(--gutter)}}
/* telas grandes crescem pela largura E pela altura: ultrawide (largo e baixo) cresce pouco, 4K cresce mais */
@media (min-width:1900px) and (min-height:1000px){:root{--escala:1.12}body{zoom:1.12}}
@media (min-width:2500px) and (min-height:1400px){:root{--escala:1.3}body{zoom:1.3}}
@media (prefers-reduced-motion:reduce){
  .pagina{animation:none}
  .disco--mapa{transition:none;transform:none;opacity:1}
}