/* Biblioteca de componentes do Sentinela VR, corpo "tela" (computador e celular).
   Nenhum valor de cor, canto ou tamanho mora aqui: tudo vem das variáveis que tema.js escreve.
   Cada peça tem o prefixo c- e responde à largura do seu contêiner (container queries), não da
   janela: a galeria mostra a mesma peça em 375 px ao lado da versão larga. */

/* ---------- vidro ---------- */
.c-vidro{background:var(--vidro);backdrop-filter:var(--desfoque);-webkit-backdrop-filter:var(--desfoque);border:1px solid var(--borda);border-radius:var(--canto-painel);color:var(--texto)}
.c-vidro--denso{background:var(--vidro-denso);border-color:var(--borda-densa)}

/* ---------- ícone ---------- */
.c-icone{width:1.1em;height:1.1em;flex:none;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;vertical-align:-0.15em}

/* ---------- selo: estado com fundo sólido e tinta escura (nunca texto colorido sobre vidro) ---------- */
.c-selo{display:inline-flex;align-items:center;gap:var(--e-s);min-height:28px;padding:4px 12px;border-radius:var(--canto-selo);font-size:var(--t-micro);font-weight:var(--p-forte);line-height:1.2;white-space:nowrap;font-variant-numeric:tabular-nums}
.c-selo--ok{background:var(--n0);color:var(--n0-tinta)}
.c-selo--aviso{background:var(--n1);color:var(--n1-tinta)}
.c-selo--alto{background:var(--n2);color:var(--n2-tinta)}
.c-selo--critico{background:var(--n3);color:var(--n3-tinta)}
.c-selo--neutro{background:var(--neutro);color:var(--texto)}
.c-selo--inverso{background:var(--inverso);color:var(--inverso-texto)}
.c-selo--contagem{background:var(--acao);color:#fff;border-radius:var(--canto-pilula);min-width:36px;justify-content:center;padding:4px 10px}

/* ---------- botão ---------- */
.c-botao{display:inline-flex;align-items:center;justify-content:center;gap:var(--e-m);min-height:var(--h-botao);padding:0 22px;border-radius:var(--canto-pilula);border:0;background:var(--neutro);color:var(--texto);font:inherit;font-size:var(--t-botao);font-weight:var(--p-normal);white-space:nowrap;cursor:pointer}
.c-botao:hover{background:var(--cartao-hover)}
.c-botao:focus-visible{outline:3px solid var(--acao);outline-offset:2px}
/* duas classes de propósito: a cor do texto do primário e do inverso não pode ser vencida por regra de contexto */
.c-botao.c-botao--primario{background:var(--acao);color:#fff;font-weight:var(--p-forte)}
.c-botao.c-botao--primario:hover{background:var(--acao-hover)}
.c-botao.c-botao--inverso{background:var(--inverso);color:var(--inverso-texto);font-weight:var(--p-forte)}
.c-botao--fantasma{background:transparent;border:1px solid var(--borda)}
.c-botao--compacto{min-height:var(--h-toque);padding:0 16px;font-size:var(--t-auxiliar)}
.c-botao--roda{width:var(--h-roda);min-height:var(--h-roda);padding:0;border-radius:50%;line-height:1}
.c-botao--roda .c-icone{width:28px;height:28px;stroke-width:2.8}
.c-botao--icone{width:var(--h-toque);min-height:var(--h-toque);padding:0;border-radius:50%;line-height:1}
.c-botao--icone .c-icone{width:20px;height:20px}
.c-botao kbd{font:600 .75em var(--fonte);padding:1px 6px;border:1px solid currentColor;border-radius:6px;opacity:.75}
.c-botao--primario kbd{opacity:.9}

/* ---------- pílula de contexto: caso, sala, relógio ---------- */
.c-pilula{display:inline-flex;align-items:center;gap:var(--e-gg);padding:10px 20px 10px 16px;border-radius:var(--canto-pilula)}
.c-pilula__ponto{width:12px;height:12px;border-radius:50%;flex:none;background:var(--n0);box-shadow:0 0 0 4px color-mix(in srgb,var(--n0) 25%,transparent)}
.c-pilula__ponto[data-nivel="1"]{background:var(--n1);box-shadow:0 0 0 4px color-mix(in srgb,var(--n1) 25%,transparent)}
.c-pilula__ponto[data-nivel="2"]{background:var(--n2);box-shadow:0 0 0 4px color-mix(in srgb,var(--n2) 25%,transparent)}
.c-pilula__ponto[data-nivel="3"]{background:var(--n3);box-shadow:0 0 0 4px color-mix(in srgb,var(--n3) 25%,transparent)}
.c-pilula__col{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.c-pilula__col strong{font-size:var(--t-destaque);font-weight:var(--p-forte);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-pilula__col small{font-size:var(--t-micro);color:var(--texto-fraco);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} /* a sala não quebra em duas linhas na pílula estreita */
.c-pilula__sep{padding-left:var(--e-gg);border-left:1px solid var(--borda)}
.c-pilula strong.num{font-variant-numeric:tabular-nums}

/* ---------- segmentos: escolha entre grupos, com rolagem visível ---------- */
.c-segmentos{position:relative;display:flex;align-items:center;gap:var(--e-xs);width:100%;max-width:100%;min-width:0}
.c-segmentos__faixa{display:flex;gap:var(--e-xs);padding:var(--e-s);border-radius:var(--canto-pilula);background:var(--cavidade);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;flex:1;min-width:0;scroll-behavior:smooth}
.c-segmentos__faixa::-webkit-scrollbar{display:none}
.c-segmentos__item{flex:none;scroll-snap-align:start;min-height:var(--h-toque);padding:0 18px;border-radius:var(--canto-pilula);border:0;background:transparent;color:var(--texto);font:inherit;font-size:var(--t-auxiliar);font-weight:var(--p-normal);white-space:nowrap;cursor:pointer}
.c-segmentos__item[aria-selected=true]{background:var(--inverso);color:var(--inverso-texto)}
.c-segmentos__item:focus-visible{outline:3px solid var(--acao);outline-offset:-3px}
.c-segmentos__seta{flex:none;display:none}
.c-segmentos--transborda .c-segmentos__seta{display:inline-flex}
.c-segmentos--transborda .c-segmentos__faixa{mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 24px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 24px),transparent)}
.c-segmentos--no-inicio .c-segmentos__faixa{mask-image:linear-gradient(90deg,#000,#000 calc(100% - 24px),transparent);-webkit-mask-image:linear-gradient(90deg,#000,#000 calc(100% - 24px),transparent)}
.c-segmentos--no-fim .c-segmentos__faixa{mask-image:linear-gradient(90deg,transparent,#000 24px,#000);-webkit-mask-image:linear-gradient(90deg,transparent,#000 24px,#000)}

/* ---------- cartão de opção: conduta, parâmetro, peça ---------- */
/* Regra de canto: dentro de um painel de 40 px com recuo de 16 a 22, as peças internas têm 24; dentro delas, 18. Canto dentro de canto nunca é "parecido", é derivado. */
.c-opcao{display:flex;flex-direction:column;justify-content:space-between;gap:var(--e-m);min-height:var(--h-cartao);padding:var(--recuo-cartao) calc(var(--recuo-cartao) + 2px);border-radius:var(--canto-cartaoPequeno);border:0;background:var(--cartao);color:var(--texto);text-align:left;font:inherit;cursor:pointer;container-type:inline-size}
.c-opcao:hover{background:var(--cartao-hover)}
.c-opcao:focus-visible{outline:3px solid var(--acao);outline-offset:2px}
.c-opcao[aria-pressed=true]{background:var(--inverso);color:var(--inverso-texto)}
.c-opcao__topo{display:flex;align-items:center;gap:var(--e-m);min-height:28px}
.c-opcao__topo:empty{display:none}
.c-opcao__topo .c-selo--contagem{margin-left:auto}
.c-opcao__corpo{display:flex;flex-direction:column;gap:2px;min-width:0}
.c-opcao__nome{font-size:var(--t-cartao);font-weight:var(--p-forte);line-height:1.25;overflow-wrap:anywhere}
.c-opcao__sub{font-size:var(--t-corpo);color:var(--texto-fraco)}
.c-opcao[aria-pressed=true] .c-opcao__sub{color:inherit;opacity:.8}
.c-opcao__valor{font-size:38px;font-weight:var(--p-extra);font-variant-numeric:tabular-nums;line-height:1}
.c-opcao__valor small{font-size:var(--t-botao);font-weight:var(--p-normal)}

/* ---------- grupo de escolha: substitui fieldset/legend no cartão de início ---------- */
.c-grupo{border:1px solid var(--borda);border-radius:var(--canto-cartaoPequeno);background:var(--interno);padding:var(--recuo-cartao) var(--recuo-cartao) calc(var(--recuo-cartao) - 4px);display:flex;flex-direction:column;gap:var(--e-s);min-width:0}
.c-grupo--ativo{border-color:var(--acao);box-shadow:0 0 0 1px var(--acao)}
.c-grupo__cab{display:flex;flex-direction:column;gap:2px;padding:0 4px 6px}
.c-grupo__nome{font-size:var(--t-destaque);font-weight:var(--p-forte);line-height:1.2}
.c-grupo__local{font-size:var(--t-auxiliar);color:var(--texto-fraco);line-height:1.25}
.c-grupo__item{display:flex;align-items:center;gap:12px;min-height:var(--h-opcao);padding:0 8px;border-radius:14px;font-size:var(--t-corpo);font-weight:var(--p-normal);cursor:pointer}
.c-grupo__item:hover{background:var(--neutro)}
.c-grupo__item input{width:22px;height:22px;margin:0;accent-color:var(--acao);flex:none}
.c-grupo__item:has(input:focus-visible){outline:3px solid var(--acao);outline-offset:-3px}

/* ---------- anel do índice ---------- */
.c-anel{display:inline-flex;flex-direction:column;align-items:center;gap:var(--e-m);width:var(--anel)}
.c-anel>svg{width:100%;height:auto} /* só o anel escala; os ícones do selo e da tendência têm o próprio tamanho */
.c-anel>svg{overflow:visible} /* a largura é a do token --anel (150 no computador, 116 no celular); fixa em 150 o anel vazava a coluna no celular */
.c-anel>svg circle{fill:none;stroke-width:12;stroke-linecap:round}
.c-anel__trilho{stroke:var(--trilha)}
.c-anel__valor{transition:stroke-dasharray .6s}
.c-anel__numero{font:var(--p-extra) 52px var(--fonte);text-anchor:middle;fill:var(--texto)} /* o SVG escala com a largura do anel: 52 em 150, 40 em 116 */
/* índice acessório (IFR, IDE): o cartão pequeno do painel (fundo, raio e recuo de .sen__mini) com o arco do anel em 56 px, o número
   dentro e, ao lado, o selo com a frase do estado. O selo quebra linha dentro do cartão, nunca corta. */
.c-indice{background:var(--interno);border-radius:var(--canto-faixa);padding:calc(var(--recuo-cartao) - 2px) var(--recuo-cartao);display:flex;flex-direction:column;gap:6px;min-width:0}
.c-indice .c-rotulo{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} /* o rótulo nunca passa da borda do cartão */
.c-indice__linha{display:flex;align-items:center;gap:10px;min-width:0}
.c-indice__arco{width:56px;flex:none;height:auto;overflow:visible}
.c-indice__arco circle{fill:none;stroke-width:8;stroke-linecap:round}
.c-indice__numero{font:var(--p-extra) 20px var(--fonte);text-anchor:middle;fill:var(--texto);font-variant-numeric:tabular-nums}
.c-indice .c-selo{white-space:normal;height:auto;min-width:0;line-height:1.25;padding-block:4px;text-align:left}.c-anel__tend{font-size:var(--t-auxiliar);color:var(--texto-fraco);display:inline-flex;align-items:center;gap:6px}

/* ---------- barra de previsão ---------- */
.c-barra{display:grid;grid-template-columns:56px 1fr 48px;gap:var(--e-m);align-items:center;font-size:var(--t-auxiliar);min-height:28px}
.c-barra__trilha{height:10px;border-radius:5px;background:var(--trilha);overflow:hidden}
.c-barra__trilha i{display:block;height:100%;border-radius:5px}
.c-barra strong{text-align:right;font-variant-numeric:tabular-nums;font-weight:var(--p-forte)}

/* ---------- curva ---------- */
/* ---------- convite: sugestão em vidro denso, nunca modal ---------- */
/* o texto nunca encolhe abaixo de 200 px: quando não cabe ao lado, a ação desce para a linha de baixo, à direita */
.c-convite{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center;padding:var(--recuo-cartao) calc(var(--recuo-cartao) + 2px);border-radius:var(--canto-cartaoPequeno);background:var(--vidro-denso);border-color:var(--borda-densa)}
.c-convite__icone{flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:var(--canto-faixa);background:var(--interno);color:var(--realce)}
.c-convite__icone .c-icone{width:28px;height:28px}
.c-convite__texto{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:2px}
.c-convite__texto strong{font-size:var(--t-destaque);font-weight:var(--p-extra)}
.c-convite .c-botao{flex:none;margin-left:auto}

/* ---------- sinais agora: os números do monitor, no painel ---------- */
.c-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.c-sinais-caixa{container-type:inline-size}
.c-sinais{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
/* com menos de 100 px por célula, "82/51" e "35.7" não cabem ao lado do rótulo: três por linha, duas linhas */
@container (max-width:620px){.c-sinais{grid-template-columns:repeat(3,1fr)}}
.c-sinal{position:relative;background:var(--interno);border-radius:var(--canto-faixa);padding:8px 8px 8px 12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.c-sinal__rotulo{font-size:var(--t-micro);font-weight:var(--p-forte);color:var(--texto-fraco);letter-spacing:.02em}
.c-sinal strong{font-size:var(--t-destaque);font-weight:var(--p-extra);line-height:1.1;font-variant-numeric:tabular-nums}
/* citado em "Por quê": a mesma barra do nível que marca o motivo, para o olho ligar os dois */
.c-sinal--citado::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:4px;border-radius:2px;background:var(--n)}

.c-curva{width:100%;height:76px;border-radius:var(--canto-faixa);background:var(--interno)}
.c-curva polyline{fill:none;stroke-width:3;stroke-linejoin:round}
.c-curva .c-curva__agora{stroke:var(--agora);stroke-dasharray:4 4}
.c-curva .c-curva__grade{stroke:var(--grade)}

/* ---------- fala: enfermeira e Sentinela ---------- */
.c-fala{display:flex;flex-direction:column;gap:var(--e-g);padding:var(--recuo-cartao) calc(var(--recuo-cartao) + 2px);border-radius:var(--canto-cartaoPequeno);background:color-mix(in srgb,var(--realce) 12%,transparent);border:1px solid color-mix(in srgb,var(--realce) 40%,transparent)}
.c-fala__quem{font-size:var(--t-micro);font-weight:var(--p-forte);color:var(--realce)}
.c-fala__texto{margin:0;font-size:var(--t-cartao);font-weight:var(--p-forte);line-height:1.3}
.c-fala__acoes{display:flex;gap:var(--e-m);flex-wrap:wrap}
/* a ação nunca sai do cartão: divide a linha enquanto cabe (120 px cada), senão empilha; texto longo quebra em vez de vazar */
.c-fala__acoes .c-botao{flex:1 1 120px;min-width:0;max-width:100%;height:auto;min-height:var(--h-toque);padding-block:10px;white-space:normal;text-align:center}
.c-fala__acoes:empty{display:none}

/* ---------- registro ---------- */
.c-registro{display:flex;flex-direction:column;gap:var(--e-m);padding:var(--recuo-cartao) calc(var(--recuo-cartao) + 2px);border-radius:var(--canto-cartaoPequeno);background:var(--interno);border:1px solid var(--borda)}
.c-registro__cab{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.c-registro__cab h3{margin:0;font-size:var(--t-destaque);font-weight:var(--p-forte)}
.c-registro__cab span{font-size:var(--t-auxiliar);color:var(--texto-fraco)}
.c-registro__linha{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--separador)}
.c-registro__nome{font-size:var(--t-corpo);font-weight:var(--p-normal);min-width:0;overflow-wrap:anywhere}
.c-registro__vazio{margin:0;font-size:var(--t-corpo);color:var(--texto-fraco)}

/* ---------- doca ---------- */
/* A doca não rola. Recuo lateral maior que o vertical, para o primeiro e o último botão saírem da curva da pílula. */
.c-doca{position:relative;display:flex;align-items:center;gap:var(--e-m);padding:var(--e-m) var(--e-gg);border-radius:var(--canto-pilula);max-width:100%}
.c-doca__fixos,.c-doca__mais{display:flex;gap:var(--e-m)}
.c-doca .c-botao{flex:none}
.c-doca__abrir{display:none}
/* compacta: ficam os fixos e o "Mais"; o resto vira menu vertical de vidro acima da doca */
.c-doca--compacta .c-doca__abrir{display:inline-flex}
.c-doca--compacta .c-doca__mais{display:none;position:absolute;left:0;right:0;bottom:calc(100% + 10px);grid-template-columns:1fr 1fr;gap:var(--e-m);padding:var(--e-m);border-radius:var(--canto-cartaoPequeno);background:var(--vidro);backdrop-filter:var(--desfoque);-webkit-backdrop-filter:var(--desfoque);border:1px solid var(--borda)} /* folha de ações da largura da doca, em duas colunas; antes nascia no canto e cobria o orbe */
.c-doca--compacta .c-doca__mais .c-botao{justify-content:center;width:100%}
.c-doca--compacta.c-doca--aberta .c-doca__mais{display:grid}

/* ---------- alerta: faixa no alto, que envelhece ---------- */
.c-alerta{display:flex;align-items:center;gap:var(--e-gg);padding:10px 18px 10px 12px;border-radius:22px;background:var(--alerta-fundo);border:1px solid var(--alerta-borda);color:var(--texto);font-size:var(--t-corpo);max-width:100%;transition:opacity .4s}
.c-alerta__texto{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-alerta__idade{font-size:var(--t-micro);color:var(--texto-fraco);white-space:nowrap;margin-left:auto}
/* envelhecer esmaece o texto, nunca o selo: o selo precisa continuar passando o contraste (4,34:1 quando o banner inteiro esmaecia) */
.c-alerta--antigo .c-alerta__texto,.c-alerta--antigo .c-alerta__idade{opacity:.72}
.c-alerta--recolhido{padding:6px 12px 6px 8px;font-size:var(--t-auxiliar)}
.c-alerta--recolhido .c-alerta__texto{display:none}
@keyframes c-entra{from{transform:translateY(-10px);opacity:0}}
.c-alerta--novo{animation:c-entra .35s ease-out}
@media (prefers-reduced-motion:reduce){.c-alerta--novo{animation:none}}

/* ---------- orbe: Sentinela recolhido ---------- */
.c-orbe{width:104px;height:104px;border-radius:50%;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:0;padding:0;cursor:pointer;color:var(--texto);font:inherit;position:relative}
.c-orbe::before{content:"";position:absolute;inset:0;border-radius:50%;border:4px solid var(--n0);pointer-events:none}
.c-orbe[data-nivel="1"]::before{border-color:var(--n1)}.c-orbe[data-nivel="2"]::before{border-color:var(--n2)}.c-orbe[data-nivel="3"]::before{border-color:var(--n3)}
.c-orbe__num{font-size:var(--t-numero);font-weight:var(--p-extra);line-height:1;font-variant-numeric:tabular-nums}
.c-orbe .c-selo{min-height:22px;padding:2px 8px;font-size:12px}
.c-orbe:focus-visible{outline:3px solid var(--acao);outline-offset:3px}

/* ---------- painel móvel: cabeçalho com pegador, corpo, encaixe ---------- */
.c-painel{display:flex;flex-direction:column;min-width:0;max-width:100%}
/* recuo simétrico: recolhido, o cabeçalho é o painel inteiro e o botão redondo precisa de ar embaixo também */
.c-painel__cab{display:flex;align-items:center;gap:var(--e-g);padding:var(--e-m) var(--recuo-painel);min-height:var(--h-botao)} /* o mesmo recuo dos dois lados e no corpo */
/* o cabeçalho inteiro arrasta (fora dos botões); o pegador é o alvo de 44 px e o foco de teclado */
.c-painel__cab{cursor:grab;touch-action:none;user-select:none}
.c-painel--arrastando .c-painel__cab,.c-painel--arrastando .c-painel__pegador{cursor:grabbing}
.c-painel__pegador{display:inline-flex;align-items:center;justify-content:center;width:var(--h-toque);min-height:var(--h-toque);margin-left:calc(var(--recuo-painel) * -1 + var(--e-m));padding:0;border:0;background:transparent;border-radius:12px;color:var(--texto-fraco);cursor:grab;flex:none;touch-action:none;font:inherit}
.c-painel__pegador:hover{background:var(--neutro)}
.c-painel__pegador:focus-visible{outline:3px solid var(--acao);outline-offset:-3px}
.c-painel__pegador .c-icone{width:22px;height:22px}
.c-painel--solto{position:fixed;right:auto;bottom:auto;transform:none;z-index:9}
.c-painel--arrastando{transition:none;box-shadow:0 18px 40px rgba(0,0,0,.25)}
.c-painel__titulo{margin:0;flex:1;min-width:0;font-size:var(--t-cartao);font-weight:var(--p-extra);letter-spacing:.06em;text-transform:uppercase;color:var(--realce);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-painel__acoes{display:flex;gap:var(--e-s);flex:none}
/* a rolagem continua por roda, dedo e teclado; a barra não aparece sobre o vidro */
.c-painel__corpo{padding:2px var(--recuo-painel) var(--recuo-painel);display:flex;flex-direction:column;gap:var(--e-g);overflow:auto;scrollbar-width:none;border-radius:0 0 calc(var(--canto-painel) - 1px) calc(var(--canto-painel) - 1px)} /* o corpo que rola é cortado pelo canto do painel, não reto */
.c-painel__corpo::-webkit-scrollbar{display:none}
/* há mais abaixo: a borda de baixo do corpo esmaece, como nos segmentos */
.c-painel--rola-fim .c-painel__corpo{mask-image:linear-gradient(180deg,#000 calc(100% - 40px),transparent);-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 40px),transparent)}
.c-painel__corpo:focus-visible{outline:3px solid var(--acao);outline-offset:-3px;border-radius:var(--canto-cartaoPequeno)}
.c-painel--recolhido .c-painel__corpo{display:none}
.c-painel--direita{position:fixed;right:14px;top:92px;width:410px;max-height:calc(100vh - 200px)}
.c-painel--esquerda{position:fixed;left:14px;top:92px;width:410px;max-height:calc(100vh - 200px)}
.c-painel--baixo{position:fixed;left:50%;bottom:92px;transform:translateX(-50%);width:min(1180px,calc(100vw - 24px));max-height:calc(100vh - 190px)}

/* ---------- texto de apoio dentro das peças ---------- */
.c-rotulo{margin:0;font-size:var(--t-micro);letter-spacing:.1em;text-transform:uppercase;color:var(--texto-fraco);font-weight:var(--p-forte)}
.c-titulo{margin:0;font-size:var(--t-titulo);font-weight:var(--p-forte);line-height:1.15}
.c-sub{margin:0;font-size:var(--t-auxiliar);color:var(--texto-fraco)}

/* ---------- corpo celular: a mesma peça, estreita ---------- */
@container (max-width:430px){
  .c-opcao{min-height:96px;padding:var(--recuo-cartao)}
  .c-opcao__nome{font-size:var(--t-destaque)}
}