/* calor e proporção: coluna de celular, detalhes nos cartões e nas listas */
@media (min-width: 480px) and (max-width: 959px) { .pm { width: 100%; max-width: 480px; margin-inline: auto; } }
@keyframes gira { to { transform: rotate(360deg); } }

/* Painel do celular, versão final: hierarquia, cartões agrupados, cor e movimento */
.pm { gap: 12px; padding-top: 4px; }
.pm > * { animation: seq-entra 480ms var(--suave-sai) backwards; animation-delay: calc(var(--i, 0) * 70ms); }
/* cartão verde */
/* dois cartões coloridos */
/* cartões de conteúdo: título dentro, sem linha separando */
/* meta do dia: caixa arredondada dentro do cartão */
@keyframes pm-enche { from { width: 0; } }
/* linhas das listas */
@media (prefers-reduced-motion: reduce) { .pm > * { animation: none; } }

/* Agenda do celular */
.agm, .agm__barra { display: none; }
@media (max-width: 959px) {
  .ag--grande { display: none; }
  .agm { display: block; padding-bottom: 170px; }
  .conteudo:has(.agm) .topo-app { display: none; }
  .agm__barra { position: fixed; left: 0; right: 0; bottom: calc(96px + env(safe-area-inset-bottom)); z-index: 40; display: flex; justify-content: center; align-items: center; gap: 12px; pointer-events: none; }
  .agm__barra > * { pointer-events: auto; }
}
.agm__topo { padding-top: 6px; }
.agm__data { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; width: 100%; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.agm__sem { display: inline-flex; align-items: center; gap: 12px; font-size: 3.5rem; font-weight: 800; letter-spacing: -0.05em; line-height: 1; }
.agm__bola { width: 14px; height: 14px; margin-top: 8px; border-radius: 50%; background: #FF3B30; }
.agm__mes { display: grid; justify-items: end; padding-top: 4px; color: #9A9FA3; line-height: 1.15; }
.agm__mes b { font-size: 1.375rem; font-weight: 800; letter-spacing: -0.02em; }
.agm__mes span { font-size: 1.375rem; font-weight: 700; opacity: 0.6; }
.agm__faixa { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; margin: 18px 0 0; padding-bottom: 14px; border-bottom: 1.5px dashed var(--borda); touch-action: pan-y; }
.agm__d { position: relative; display: grid; justify-items: center; gap: 4px; padding: 10px 0 8px; border: 1.5px solid transparent; border-radius: 16px; background: none; color: #A3A8AB; font: inherit; cursor: pointer; transition: background-color 200ms, border-color 200ms, transform 200ms var(--ios); }
.agm__d span { font-size: 1.375rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1; }
.agm__d em { font-size: 0.6875rem; font-style: normal; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.agm__d--hoje span { color: var(--tinta); }
.agm__d--sel { border-color: var(--borda); background: var(--sup); box-shadow: 0 4px 14px rgb(0 0 0 / 0.08); color: var(--tinta); transform: translateY(-1px); }
.agm__d--sel em { color: #FF3B30; }
.agm__tem { position: absolute; bottom: 3px; width: 5px; height: 5px; border-radius: 50%; background: #00873A; }
.agm__d--sel .agm__tem { display: none; }
.agm__res { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 16px 2px 10px; color: var(--suave); font-size: 0.9375rem; font-weight: 600; }
.agm__res b { color: var(--tinta); font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em; }
.agm__entra { animation: seq-entra 420ms var(--suave-sai) backwards; }
.agm__horas { margin: 0; padding: 0; list-style: none; }
.agm__horas li { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 10px; min-height: 44px; border-top: 1px solid var(--borda); animation: seq-entra 380ms var(--suave-sai) backwards; animation-delay: calc(var(--k, 0) * 30ms); }
.agm__horas time { padding-top: 6px; color: #9A9FA3; font-size: 0.8125rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.agm__horas li > div { display: grid; gap: 8px; padding: 6px 0; }
.agm__dia { margin-bottom: 14px; animation: seq-entra 380ms var(--suave-sai) backwards; animation-delay: calc(var(--k, 0) * 50ms); }
.agm__dia h3 { margin: 0 2px 8px; font-size: 1.0625rem; font-weight: 800; }
.agm__dia > div { display: grid; gap: 8px; }
.agm__card { --pt: #3B82F6; display: grid; gap: 4px; width: 100%; padding: 12px 14px; border: 0; border-radius: 18px; background: #F2F3F2; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: transform 160ms var(--ios); }
.agm__card:active { transform: scale(0.98); }
.agm__card--confirmado { --pt: #34C759; } .agm__card--concluido { --pt: #9A9FA3; } .agm__card--faltou, .agm__card--cancelado { --pt: #FF3B30; } .agm__card--agendado { --pt: #FF9500; }
.agm__t { display: flex; align-items: center; gap: 8px; }
.agm__ponto { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--pt); }
.agm__t b { flex: 1; min-width: 0; overflow: hidden; font-size: 1.0625rem; font-weight: 800; letter-spacing: -0.015em; text-overflow: ellipsis; white-space: nowrap; }
.agm__hora { color: var(--suave); font-size: 0.8125rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.agm__sub { padding-left: 18px; color: var(--suave); font-size: 0.9375rem; }
.agm__tags { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 0 0 18px; }
.agm__tag { padding: 3px 10px; border-radius: 8px; background: #E4E6E5; color: #4A4F52; font-size: 0.75rem; font-weight: 700; }
.agm__tag--pago { background: #B7F0CC; color: #004D1E; } .agm__tag--aberto { background: #FFD3D0; color: #B80012; }
.agm__card--cancelado, .agm__card--faltou { opacity: 0.7; }
.agm__vazio { display: grid; gap: 4px; padding: 36px 8px; text-align: center; color: var(--suave); }
.agm__vazio b { color: var(--tinta); font-size: 1.125rem; }
.agm__filtro { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 12px 0 22px; border: 0; border-radius: 999px; background: #0F1F1A; color: #FFFFFF; font: inherit; font-size: 0.9375rem; font-weight: 800; letter-spacing: 0.08em; box-shadow: 0 10px 28px rgb(0 0 0 / 0.28); cursor: pointer; transition: transform 160ms var(--ios); }
.agm__filtro:active, .agm__novo:active { transform: scale(0.95); }
.agm__filtro-ic { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgb(255 255 255 / 0.16); }
.agm__filtro-ic svg { width: 20px; height: 20px; }
.agm__novo { display: grid; place-items: center; width: 52px; height: 52px; border: 0; border-radius: 50%; background: #00873A; color: #FFFFFF; box-shadow: 0 10px 28px rgb(0 135 58 / 0.4); cursor: pointer; transition: transform 160ms var(--ios); }
.agm__novo .ic { width: 24px; height: 24px; stroke-width: 2.2; }
/* folha de baixo para cima */
dialog.agm-folha { position: fixed; inset: auto 0 0 0; width: 100%; max-width: 520px; height: auto; max-height: 88dvh; margin: auto auto 0; padding: 8px 18px calc(24px + env(safe-area-inset-bottom)); border: 0; border-radius: 30px 30px 0 0; background: #FFFFFF; color: var(--tinta); box-shadow: 0 -10px 50px rgb(0 0 0 / 0.25); animation: agm-sobe 380ms var(--ios); }
dialog.agm-folha::backdrop { background: rgb(0 0 0 / 0.38); animation: agm-vela 300ms ease; }
@keyframes agm-sobe { from { transform: translateY(100%); } }
@keyframes agm-vela { from { opacity: 0; } }
.agm-folha__alca { width: 40px; height: 5px; margin: 4px auto 14px; border-radius: 3px; background: rgb(128 128 128 / 0.4); }
.agm-cal__topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.agm-cal__topo h2 { font-size: 1.75rem; font-weight: 800; letter-spacing: -0.03em; } .agm-cal__topo h2 span { color: #9A9FA3; }
.agm-cal__topo > div { display: flex; gap: 8px; }
.agm-cal__nav { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #F2F3F2; color: var(--tinta); cursor: pointer; }
.agm-cal__sem, .agm-cal__grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.agm-cal__sem span { padding: 6px 0; color: #9A9FA3; font-size: 0.8125rem; font-weight: 700; text-align: center; }
.agm-cal__d { position: relative; display: grid; place-items: center; height: 50px; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.agm-cal__d span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; font-size: 1.1875rem; font-weight: 600; transition: background-color 160ms; }
.agm-cal__d--fora span { color: #B9BDBF; }
.agm-cal__d--hoje span { color: #FF3B30; font-weight: 800; }
.agm-cal__d--sel span { background: #0F1F1A; color: #FFFFFF; font-weight: 800; }
.agm-cal__d i { position: absolute; bottom: 1px; width: 5px; height: 5px; border-radius: 50%; background: #00873A; }
.agm-cal__d--sel i { background: #FFFFFF; bottom: 5px; }
.agm-cal__hoje { display: block; width: 100%; min-height: 50px; margin-top: 12px; border: 0; border-radius: 16px; background: #C9F4D9; color: #006B2D; font: inherit; font-size: 1rem; font-weight: 800; cursor: pointer; }
.agm-fil__tit { font-size: 1.75rem; font-weight: 800; letter-spacing: -0.03em; } .agm-fil__sub { margin: 2px 0 14px; color: var(--suave); }
.agm-fil { display: grid; gap: 10px; }
.agm-fil__op { display: flex; align-items: center; gap: 12px; width: 100%; padding: 14px 16px; border: 1.5px solid var(--borda); border-radius: 20px; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: transform 160ms var(--ios), background-color 200ms; }
.agm-fil__op:active { transform: scale(0.98); }
.agm-fil__op--sel { border-color: #00873A; background: #C9F4D9; color: #0A3D2D; }
.agm-fil__txt { display: grid; flex: 1; gap: 2px; } .agm-fil__txt b { font-size: 1.1875rem; font-weight: 800; } .agm-fil__txt span { font-size: 0.9375rem; opacity: 0.75; }
.agm-fil__ok { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #00873A; color: #FFFFFF; } .agm-fil__ok:empty { background: none; border: 1.5px solid var(--borda); }
.agm-fil__ok .ic { width: 16px; height: 16px; stroke-width: 3; }
:root[data-tema="escuro"] dialog.agm-folha { background: #1C1C1E; }
:root[data-tema="escuro"] .agm__card { background: #2C2C2E; } :root[data-tema="escuro"] .agm__tag { background: #3A3A3C; color: #E5E5E7; }
:root[data-tema="escuro"] .agm__tag--pago { background: #0F4A2B; color: #30D158; } :root[data-tema="escuro"] .agm__tag--aberto { background: #5E1510; color: #FF7A70; }
:root[data-tema="escuro"] .agm-cal__nav { background: #2C2C2E; } :root[data-tema="escuro"] .agm-cal__d--sel span { background: #FFFFFF; color: #000000; } :root[data-tema="escuro"] .agm-cal__d--sel i { background: #000; }
:root[data-tema="escuro"] .agm-cal__hoje, :root[data-tema="escuro"] .agm-fil__op--sel { background: #0F4A2B; color: #30D158; }
:root[data-tema="escuro"] .agm__filtro { background: #FFFFFF; color: #000000; } :root[data-tema="escuro"] .agm__filtro-ic { background: rgb(0 0 0 / 0.12); }
:root[data-tema="escuro"] .agm__d--sel { background: #1C1C1E; }
@media (prefers-reduced-motion: reduce) { dialog.agm-folha, dialog.agm-folha::backdrop, .agm__horas li, .agm__dia, .agm__entra { animation: none; } }

/* Agenda: FILTRO pequeno na linha do dia; embaixo só o + */
.agm__filtro--p { min-height: 36px; padding: 0 6px 0 14px; gap: 8px; font-size: 0.75rem; box-shadow: none; }
.agm__filtro--p .agm__filtro-ic { width: 26px; height: 26px; } .agm__filtro--p .agm__filtro-ic svg { width: 15px; height: 15px; }
@media (max-width: 959px) { .agm__barra { justify-content: flex-end; padding-right: 18px; } }

/* Painel do celular: semana, gráfico de linhas, cartões e avisos (fonte IBM Plex Sans, cartões sem linha preta) */
.pn, .pn button, .pn-aviso, .pn-aviso button { font-family: "IBM Plex Sans", Inter, system-ui, sans-serif; }
@media (max-width: 959px) { .conteudo:has(.pn) .topo-app { display: none; } }
.pn { gap: 14px; padding-top: 6px; --pn-card: #F3F3F5; --pn-txt: #0B0B0F; --pn-sub: #8A8A93; }
:root[data-tema="escuro"] .pn { --pn-card: #1C1C1E; --pn-txt: #FFFFFF; --pn-sub: #8E8E93; }
.pn > * { animation: seq-entra 480ms var(--suave-sai) backwards; }
.pn > :nth-child(2) { animation-delay: 70ms; } .pn > :nth-child(3) { animation-delay: 140ms; } .pn > :nth-child(4) { animation-delay: 210ms; }
.pn__semana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; padding: 8px 6px; border-radius: 30px; background: #FFFFFF; box-shadow: 0 0 0 1px rgb(0 0 0 / 0.08), 0 10px 28px rgb(0 0 0 / 0.07); touch-action: pan-y; }
:root[data-tema="escuro"] .pn__semana { background: #0E1626; box-shadow: 0 0 0 1px rgb(255 255 255 / 0.06); }
.pn__d { display: grid; justify-items: center; gap: 6px; padding: 12px 0 10px; border: 0; border-radius: 18px; background: none; color: var(--pn-txt); cursor: pointer; transition: background-color 220ms, transform 160ms var(--ios); }
.pn__d em { font-size: 0.6875rem; font-style: normal; font-weight: 700; letter-spacing: 0.02em; }
.pn__d b { font-size: 1.125rem; font-weight: 600; line-height: 1; }
.pn__d--fim em { color: #FF3B30; }
.pn__d--sel { background: #00873A; color: #FFFFFF; } .pn__d--sel em { color: #FFFFFF; }
:root[data-tema="escuro"] .pn__d--sel { background: #1E2A3D; }
.pn__d:active { transform: scale(0.94); }
.pn__grafico { display: grid; justify-items: center; gap: 0; padding: 6px 4px 0; color: var(--pn-txt); text-align: center; }
.pn__tabs { display: inline-flex; padding: 3px; border-radius: 999px; background: var(--pn-card); }
.pn__tabs button { min-height: 36px; padding: 0 16px; border: 0; border-radius: 999px; background: none; color: var(--pn-sub); font-size: 0.9375rem; font-weight: 600; cursor: pointer; transition: background-color 200ms, color 200ms; }
.pn__tabs button[aria-selected="true"] { background: #FFFFFF; color: var(--pn-txt); box-shadow: 0 1px 4px rgb(0 0 0 / 0.14); }
:root[data-tema="escuro"] .pn__tabs button[aria-selected="true"] { background: #3A3A3C; }
.pn__corpo { display: grid; justify-items: center; width: 100%; }
.pn__rot { margin-top: 22px; color: var(--pn-sub); font-size: 0.9375rem; }
.pn__num { margin-top: 2px; font-size: 3.25rem; font-weight: 700; letter-spacing: -0.035em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.pn__delta { display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; color: var(--pn-sub); font-size: 0.9375rem; }
.pn__delta-ic { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #A9A9B0; color: #FFFFFF; }
.pn__delta-ic svg { width: 12px; height: 12px; }
.pn__graf { width: 100%; height: 130px; margin-top: 26px; }
.pn__graf svg { width: 100%; height: 100%; overflow: visible; }
@keyframes pn-traca { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.pn__duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pn__k { display: grid; align-content: start; gap: 6px; padding: 14px; border-radius: 22px; background: var(--pn-card); color: var(--pn-txt); text-decoration: none; transition: transform 160ms var(--ios); }
.pn__k:active { transform: scale(0.98); }
.pn__k-topo { display: flex; align-items: center; justify-content: space-between; gap: 6px; color: var(--pn-sub); font-size: 0.8125rem; font-weight: 500; min-height: 24px; }
.pn__chip { padding: 3px 8px; border-radius: 8px; background: rgb(108 92 231 / 0.14); color: #6C5CE7; font-size: 0.75rem; font-weight: 600; white-space: nowrap; }
.pn__k > b { font-size: 1.875rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.pn__k small { color: var(--pn-sub); font-size: 0.75rem; }
.pn__pag { display: grid; gap: 2px; font-size: 0.75rem; color: var(--pn-sub); }
.pn__pag b { font-size: 1rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.pn__pag--v b { color: #1F9D6B; } .pn__pag--r b { color: #FF3B30; }
.pn__avisos { display: grid; gap: 10px; }
.pn__avisos h2 { padding: 0 2px; font-size: 1.125rem; font-weight: 700; letter-spacing: -0.01em; color: var(--pn-txt); }
.pn__avisos ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pn__avisos li { animation: seq-entra 420ms var(--suave-sai) backwards; animation-delay: calc(var(--k, 0) * 50ms + 260ms); }
.pn__av { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 20px; background: var(--pn-card); color: var(--pn-txt); text-decoration: none; transition: transform 160ms var(--ios); }
.pn__av:active { transform: scale(0.98); }
.pn__av-ic { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: rgb(143 143 150 / 0.18); color: var(--pn-sub); }
.pn__av-ic .ic { width: 20px; height: 20px; stroke-width: 1.9; }
.pn__av--ok .pn__av-ic { background: rgb(52 199 89 / 0.16); color: #1F9D6B; }
.pn__av--cai .pn__av-ic { background: rgb(255 59 48 / 0.16); color: #FF3B30; }
.pn__av--atencao .pn__av-ic { background: rgb(255 149 0 / 0.18); color: #D98A0A; }
.pn__av-txt { display: grid; flex: 1; min-width: 0; gap: 2px; }
.pn__av-txt b { font-size: 0.9375rem; font-weight: 600; line-height: 1.3; }
.pn__av-txt span { color: var(--pn-sub); font-size: 0.8125rem; line-height: 1.3; }
.pn__av-q { flex: none; align-self: flex-start; color: var(--pn-sub); font-size: 0.75rem; font-weight: 500; }
.pn__vazio { padding: 16px; border-radius: 20px; background: var(--pn-card); color: var(--pn-sub); font-size: 0.9375rem; }
.pn-aviso { position: fixed; top: calc(env(safe-area-inset-top) + 58px); left: 50%; z-index: 90; display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 16px; border-radius: 999px; background: #0F1F1A; color: #FFFFFF; font-size: 0.8125rem; font-weight: 500; box-shadow: 0 10px 30px rgb(0 0 0 / 0.3); translate: -50% 0; animation: pn-aviso-entra 320ms var(--ios); }
.pn-aviso button { min-height: 32px; padding: 0 14px; border: 0; border-radius: 999px; background: #FFFFFF; color: #0F1F1A; font-size: 0.8125rem; font-weight: 700; cursor: pointer; }
.pn-aviso--sai { opacity: 0; transform: translateY(-8px); transition: opacity 200ms, transform 200ms; }
@keyframes pn-aviso-entra { from { opacity: 0; transform: translateY(-16px); } }
:root[data-tema="escuro"] .pn-aviso { background: #FFFFFF; color: #000000; } :root[data-tema="escuro"] .pn-aviso button { background: #000000; color: #FFFFFF; }
@media (prefers-reduced-motion: reduce) { .pn > *, .pn__avisos li, .pn-aviso { animation: none; } }

/* ===== Login: degradê grafite, cartão branco e botão preto ===== */
.entrada__quadro { background: radial-gradient(130% 75% at 50% 0%, #14171A 0%, #3C4D5C 42%, #9AA5AE 70%, #E4E4E6 100%); }
.lado { background: transparent; color: #FFFFFF; }
.lado p, .lado__fim { color: #FFFFFF; }
.lado :focus-visible { outline-color: #FFFFFF; }
.entrada__form { --sup: #FFFFFF; --sup-forte: #FFFFFF; --tinta: #0B0B0F; --suave: #6B6B73; --linha: rgb(0 0 0 / 0.1); --preench: #F2F2F4; --contorno: rgb(0 0 0 / 0.22); --hover: rgb(0 0 0 / 0.05); --hover-forte: rgb(0 0 0 / 0.1); --ocean: #0B0B0F; --ocean-2: #000000; --acao: #0B0B0F; --acao-2: #000000; --sobre: #FFFFFF; --cai: #D6303A; color: #0B0B0F; font-family: "IBM Plex Sans", Inter, system-ui, sans-serif; }
.entrada__form .btn:not(.btn--linha):not(.btn--suave):not(.btn--perigo):not(.btn--perigo-forte):not(.btn--contorno):not([disabled]) { background: #0B0B0F; color: #FFFFFF; border-color: transparent; }
.entrada__form .btn--contorno { background: #F2F2F4; color: #0B0B0F; border-color: transparent; }
.entrada__form .btn--linha { background: #0B0B0F; color: #FFFFFF; border-color: transparent; }
.entrada__form .social, .entrada__form .social--email { background: #F2F2F4; color: #0B0B0F; border-color: transparent; }
.entrada__form .campo input:not([type="checkbox"]):not([type="file"]) { background: #F2F2F4; border-color: transparent; color: #0B0B0F; }
.entrada__form .senha button { color: #0B0B0F; }
.entrada__form :focus-visible { outline-color: #0B0B0F; }
.entrada__form .t1 { font-weight: 700; letter-spacing: -0.03em; }
.entrada__duas { gap: 12px; }
.entrada__duas .btn { width: 100%; min-height: 58px; }
.entrada__duas .btn:not(.btn--contorno) { display: flex; align-items: center; justify-content: space-between; padding: 6px 6px 6px 26px; font-size: 1.0625rem; }
.entrada__duas .btn:not(.btn--contorno)::after { content: ""; flex: none; width: 46px; height: 46px; border-radius: 50%; background: #2C2C2E url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 22px no-repeat; transition: transform 220ms var(--ios); }
.entrada__duas .btn:not(.btn--contorno):active::after { transform: translateX(4px); }
@media (max-width: 899px) {
  .entrada__form { margin: -30px 12px 12px; padding: 24px 20px 24px; border-radius: 36px; box-shadow: 0 18px 50px rgb(0 0 0 / 0.22); }
}
@media (min-width: 900px) {
  .entrada__quadro { background: linear-gradient(140deg, #14171A 0%, #3C4D5C 55%, #9AA5AE 100%); }
  .entrada__form { margin: 20px; border-radius: 36px; }
}

/* ===== Painel: verde, vermelho e laranja fortes, com contraste ===== */
.pn { --pn-v: #00873A; --pn-vt: #00762F; --pn-r: #D92D20; --pn-rt: #B80012; --pn-l: #E86A00; --pn-lt: #9A4C00; }
:root[data-tema="escuro"] .pn { --pn-v: #30D158; --pn-vt: #30D158; --pn-r: #FF453A; --pn-rt: #FF6259; --pn-l: #FF9F0A; --pn-lt: #FFB04D; }
.pn__delta { font-size: 1.0625rem; font-weight: 700; gap: 9px; }
.pn__delta--ok { color: var(--pn-vt); } .pn__delta--cai { color: var(--pn-rt); } .pn__delta--neu { color: var(--pn-lt); }
.pn__delta-ic { width: 24px; height: 24px; color: #FFFFFF; }
.pn__delta--ok .pn__delta-ic { background: var(--pn-v); } .pn__delta--cai .pn__delta-ic { background: var(--pn-r); } .pn__delta--neu .pn__delta-ic { background: var(--pn-l); }
.pn__delta-ic svg { width: 14px; height: 14px; }
.pn__chip { background: var(--pn-v); color: #FFFFFF; font-weight: 700; }
.pn__pag--v b { color: var(--pn-vt); font-weight: 800; } .pn__pag--r b { color: var(--pn-rt); font-weight: 800; }
.pn__av--ok .pn__av-ic { background: var(--pn-v); color: #FFFFFF; }
.pn__av--cai .pn__av-ic { background: var(--pn-r); color: #FFFFFF; }
.pn__av--atencao .pn__av-ic { background: var(--pn-l); color: #FFFFFF; }
.pn__av-ic .ic { stroke-width: 2.1; }
.pn__av--ok .pn__av-txt b { color: var(--pn-vt); } .pn__av--cai .pn__av-txt b { color: var(--pn-rt); }
/* gráfico que acompanha o dedo ou o mouse */
.pn__graf { position: relative; touch-action: pan-y; cursor: crosshair; -webkit-user-select: none; user-select: none; }
.pn__cruz, .pn__bola { position: absolute; opacity: 0; pointer-events: none; transition: opacity 160ms; }
.pn__cruz { top: 0; bottom: 0; left: 0; width: 1.5px; margin-left: -0.75px; background: var(--pn-txt); }
.pn__bola { left: 0; top: 0; width: 16px; height: 16px; margin: -8px 0 0 -8px; border: 3.5px solid var(--pn-card); border-radius: 50%; background: var(--pn-txt); box-shadow: 0 2px 8px rgb(0 0 0 / 0.3); }
.pn__graf--vivo .pn__cruz { opacity: 0.35; } .pn__graf--vivo .pn__bola { opacity: 1; }
/* abas Hoje, Semanal, Mensal com lente de vidro */
.pn__tabs { position: relative; display: grid; grid-template-columns: repeat(3, minmax(88px, 1fr)); padding: 4px; border-radius: 999px; background: var(--pn-card); }
.pn__tabs button { position: relative; z-index: 1; background: none !important; box-shadow: none !important; }
.pn__tabs button[aria-selected="true"] { color: var(--pn-txt); font-weight: 700; }
.pn__tabs .lente { top: 4px; bottom: 4px; border-radius: 999px; background: #FFFFFF; box-shadow: 0 1px 5px rgb(0 0 0 / 0.16); }
:root[data-tema="escuro"] .pn__tabs .lente { background: #3A3A3C; }
.pn__tabs { touch-action: none; -webkit-user-select: none; user-select: none; }

/* ===== Login: marca grande no degradê, sem arte ===== */
@media (max-width: 899px) {
  .lado > .marca { top: clamp(64px, 15svh, 130px); font-size: 2.375rem; font-weight: 700; letter-spacing: -0.04em; gap: 12px; text-shadow: 0 2px 24px rgb(0 0 0 / 0.35); }
  .lado > .marca .asten { width: 1.05em; height: 1.05em; }
}
.entrada__form .entrada__tit--centro .t1 { font-size: 2.75rem; font-weight: 700; letter-spacing: -0.045em; line-height: 1.05; }
.entrada__form .entrada__tit--centro p { font-size: 1.0625rem; font-weight: 500; line-height: 1.35; color: #4B4B53; }
.entrada__tempo { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; background: #C9F4D9; color: #004D1E; font-size: 0.9375rem; font-weight: 700; }
.entrada__tempo .ic { width: 17px; height: 17px; color: #00873A; }

/* ===== Clientes no celular ===== */
.cm, .fm { display: none; }
@media (max-width: 959px) {
  .cli-grande { display: none; }
  .cm, .fm { display: block; }
  .conteudo:has(.cm) .topo-app, .conteudo:has(.fm) .topo-app { display: none; }
}
.cm, .fm { font-family: "IBM Plex Sans", Inter, system-ui, sans-serif; padding-top: 8px; padding-bottom: 150px; }
.cm button, .fm button, .cm input, .cm select { font-family: inherit; }
.cm__topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cm__topo h1 { font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; line-height: 1.1; }
.cm__topo p { color: var(--suave); font-size: 0.9375rem; }
.cm__novo { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border: 0; border-radius: 50%; background: #00873A; color: #FFFFFF; cursor: pointer; box-shadow: 0 8px 22px rgb(0 135 58 / 0.35); }
.cm__novo .ic { width: 22px; height: 22px; stroke-width: 2.2; }
.cm__busca { display: flex; gap: 8px; margin-top: 16px; }
.cm__campo { display: flex; flex: 1; align-items: center; gap: 8px; min-width: 0; min-height: 48px; padding: 0 14px; border: 1px solid var(--borda); border-radius: 16px; background: var(--sup); }
.cm__campo .ic { width: 18px; height: 18px; flex: none; color: var(--suave); }
.cm__campo input { flex: 1; min-width: 0; border: 0; background: none; color: inherit; font-size: 0.9375rem; outline: none; }
.cm__campo:focus-within { border-color: #00873A; box-shadow: 0 0 0 3px rgb(0 135 58 / 0.16); }
.cm__filtro { display: inline-flex; align-items: center; gap: 8px; flex: none; min-height: 48px; padding: 0 16px; border: 1px solid var(--borda); border-radius: 16px; background: var(--sup); color: inherit; font-size: 0.9375rem; font-weight: 600; cursor: pointer; }
.cm__chips { display: flex; gap: 8px; margin: 12px -16px 0; padding: 0 16px 4px; overflow-x: auto; scrollbar-width: none; }
.cm__chips::-webkit-scrollbar { display: none; }
.cm__chip { flex: none; min-height: 38px; padding: 0 16px; border: 1px solid var(--borda); border-radius: 999px; background: var(--sup); color: inherit; font-size: 0.875rem; font-weight: 600; cursor: pointer; transition: background-color 180ms, color 180ms, transform 160ms var(--ios); }
.cm__chip:active { transform: scale(0.95); }
.cm__chip--on { border-color: #0F1F1A; background: #0F1F1A; color: #FFFFFF; }
:root[data-tema="escuro"] .cm__chip--on { border-color: #FFFFFF; background: #FFFFFF; color: #000000; }
.cm__res { display: flex; align-items: center; justify-content: space-between; margin: 14px 2px 10px; color: var(--suave); font-size: 0.9375rem; }
.cm__res b { color: var(--tinta); font-weight: 700; }
.cm__res button { min-height: 36px; padding: 0 14px; border: 0; border-radius: 999px; background: #C9F4D9; color: #006B2D; font-size: 0.875rem; font-weight: 700; cursor: pointer; }
.cm__grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.cm__li { min-width: 0; animation: seq-entra 420ms var(--suave-sai) backwards; animation-delay: calc(var(--k, 0) * 45ms); }
.cm__c { position: relative; display: grid; gap: 10px; height: 100%; padding: 10px 12px 14px; border: 1px solid var(--borda); border-radius: 22px; background: var(--sup); transition: transform 160ms var(--ios), box-shadow 200ms; }
.cm__c:active { transform: scale(0.98); }
.cm__ver { position: absolute; inset: 0; z-index: 0; border-radius: inherit; }
.cm__acoes { position: relative; z-index: 1; display: flex; justify-content: flex-end; gap: 4px; }
.cm__acoes button, .cm__acoes a { display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 50%; background: none; color: var(--suave); cursor: pointer; }
.cm__acoes .ic { width: 16px; height: 16px; }
.cm__acoes button:active, .cm__acoes a:active { background: var(--preench); }
.cm__quem { display: flex; align-items: center; gap: 8px; min-width: 0; }
.cm__quem b { min-width: 0; font-size: 0.9375rem; font-weight: 700; letter-spacing: -0.015em; line-height: 1.2; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cm__foto { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; font-size: 0.875rem; font-weight: 700; }
.cm__foto--0 { background: #CFE8FF; color: #005BD1; } .cm__foto--1 { background: #F1D6FF; color: #7B28B5; } .cm__foto--2 { background: #FFE2B8; color: #9A4C00; } .cm__foto--3 { background: #C9F4D9; color: #00873A; } .cm__foto--4 { background: #E0D9FF; color: #4A2FC2; }
.cm__dados { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; font-size: 0.75rem; }
.cm__dados li { display: flex; align-items: center; gap: 7px; min-width: 0; color: var(--suave); }
.cm__dados .ic { width: 14px; height: 14px; flex: none; }
.cm__dados a, .cm__dados span { position: relative; z-index: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: inherit; text-decoration: none; }
.cm__dados .cm__wa { color: #00762F; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.cm__dados li:last-child { color: var(--tinta); font-weight: 500; } .cm__dados li:last-child b { font-weight: 700; }
.cm__pags { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 18px; }
.cm__p { display: grid; place-items: center; min-width: 40px; height: 40px; padding: 0 8px; border: 1px solid var(--borda); border-radius: 12px; background: var(--sup); color: inherit; font-size: 0.9375rem; font-weight: 600; cursor: pointer; }
.cm__p--on { border-color: #0F1F1A; background: #0F1F1A; color: #FFFFFF; }
:root[data-tema="escuro"] .cm__p--on { border-color: #FFFFFF; background: #FFFFFF; color: #000000; }
.cm__p:disabled { opacity: 0.35; cursor: default; }
.cm__pt { color: var(--suave); }
.cm__vazio { display: grid; gap: 4px; padding: 40px 8px; text-align: center; color: var(--suave); } .cm__vazio b { color: var(--tinta); font-size: 1.125rem; }
.cmf { display: grid; gap: 12px; }
.cmf label { display: grid; gap: 6px; font-size: 0.875rem; font-weight: 600; color: var(--suave); }
.cmf select { min-height: 50px; padding: 0 14px; border: 1px solid var(--borda); border-radius: 14px; background: var(--sup); color: var(--tinta); font: inherit; font-size: 1rem; }
.cmf__pe { display: flex; gap: 10px; margin-top: 16px; }
.cmf__limpar, .cmf__ok { min-height: 52px; border: 0; border-radius: 16px; font: inherit; font-size: 1rem; font-weight: 700; cursor: pointer; }
.cmf__limpar { padding: 0 20px; background: #F2F2F4; color: #0B0B0F; } .cmf__ok { flex: 1; background: #0F1F1A; color: #FFFFFF; }
:root[data-tema="escuro"] .cmf__limpar { background: #2C2C2E; color: #FFFFFF; } :root[data-tema="escuro"] .cmf__ok { background: #FFFFFF; color: #000000; }

/* ficha do cliente */
.fm__voltar { display: inline-flex; align-items: center; gap: 4px; min-height: 40px; color: #00762F; font-size: 0.9375rem; font-weight: 700; text-decoration: none; }
.fm__voltar .ic { width: 16px; height: 16px; }
.fm__topo { display: flex; align-items: center; gap: 14px; margin-top: 4px; padding: 16px; border: 1px solid var(--borda); border-radius: 24px; background: var(--sup); }
.fm__foto { width: 64px; height: 64px; font-size: 1.25rem; }
.fm__id { display: grid; gap: 2px; min-width: 0; }
.fm__id h1 { font-size: 1.375rem; font-weight: 700; letter-spacing: -0.03em; line-height: 1.15; }
.fm__id a, .fm__id > span { overflow: hidden; color: var(--suave); font-size: 0.875rem; text-overflow: ellipsis; text-decoration: none; white-space: nowrap; }
.fm__id a[href^="https://wa"] { color: #00762F; font-weight: 700; }
.fm__id p { margin-top: 4px; color: var(--tinta); font-size: 0.8125rem; font-weight: 500; }
.fm__acoes { display: flex; gap: 8px; margin: 12px 0; }
.fm__btn { display: grid; place-items: center; flex: 1; min-height: 46px; padding: 0 12px; border: 1px solid var(--borda); border-radius: 14px; background: var(--sup); color: inherit; font-size: 0.875rem; font-weight: 700; text-decoration: none; cursor: pointer; }
.fm__btn--on { border-color: #00873A; background: #00873A; color: #FFFFFF; }
.fm__nums { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.fm__n { display: grid; align-content: start; gap: 3px; padding: 14px; border: 1px solid var(--borda); border-radius: 20px; background: var(--sup); }
.fm__n span { color: var(--suave); font-size: 0.8125rem; font-weight: 500; }
.fm__n b { font-size: 1.625rem; font-weight: 700; letter-spacing: -0.03em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.fm__n small { color: var(--suave); font-size: 0.75rem; font-weight: 600; }
.fm__freq--cai { color: #B80012 !important; } .fm__freq--ok { color: #00762F !important; } .fm__freq--neu { color: #9A4C00 !important; }
.fm__card { margin-top: 12px; padding: 16px 14px 8px; border: 1px solid var(--borda); border-radius: 24px; background: var(--sup); }
.fm__cab { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; padding: 0 2px; }
.fm__cab h2 { font-size: 1.1875rem; font-weight: 700; letter-spacing: -0.02em; }
.fm__cab button { min-height: 34px; padding: 0 14px; border: 0; border-radius: 999px; background: #C9F4D9; color: #006B2D; font-size: 0.8125rem; font-weight: 700; cursor: pointer; }
.fm__tempo, .fm__trat { margin: 0; padding: 0; list-style: none; }
.fm__tempo li { display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 8px 0; }
.fm__tempo li + li { border-top: 1px solid var(--borda); }
.fm__tempo[data-hist-m]:not(.aberto) li:nth-child(n+7) { display: none; }
.fm__ev-ic { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 50%; color: #FFFFFF; }
.fm__ev-ic .ic { width: 18px; height: 18px; }
.fm__ev-ic--ok { background: #00873A; } .fm__ev-ic--ag { background: #E86A00; } .fm__ev-ic--cai { background: #D92D20; }
.fm__ev-txt { display: grid; flex: 1; min-width: 0; gap: 1px; } .fm__ev-txt b { font-size: 0.9375rem; font-weight: 700; } .fm__ev-txt span { color: var(--suave); font-size: 0.8125rem; }
.fm__ev-val { font-size: 0.9375rem; font-weight: 700; color: #00762F; font-variant-numeric: tabular-nums; } .fm__ev-q { color: #9A4C00; font-size: 0.75rem; font-weight: 700; }
.fm__trat li { display: grid; gap: 6px; padding: 10px 0; } .fm__trat li + li { border-top: 1px solid var(--borda); }
.fm__trat-topo { display: flex; align-items: baseline; gap: 8px; } .fm__trat-topo b:first-child { flex: 1; font-size: 0.9375rem; } .fm__trat-topo span { color: var(--suave); font-size: 0.8125rem; } .fm__trat-topo b:last-child { font-size: 0.9375rem; font-variant-numeric: tabular-nums; }
.fm__trat i { display: block; height: 7px; border-radius: 999px; background: linear-gradient(90deg, #00873A var(--p), #E1E7E4 var(--p)); }
:root[data-tema="escuro"] .fm__trat i { background: linear-gradient(90deg, #30D158 var(--p), #3A3A3C var(--p)); }
.fm__vazio { padding: 12px 2px 16px; color: var(--suave); font-size: 0.9375rem; }
.fm__dados { display: grid; margin: 0; } .fm__dados div { display: flex; justify-content: space-between; gap: 12px; padding: 12px 2px; } .fm__dados div + div { border-top: 1px solid var(--borda); }
.fm__dados dt { color: var(--suave); font-size: 0.875rem; } .fm__dados dd { margin: 0; font-size: 0.9375rem; font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.fm__excluir { width: 100%; min-height: 46px; margin: 4px 0 10px; border: 0; border-radius: 14px; background: #FFD3D0; color: #B80012; font: inherit; font-size: 0.9375rem; font-weight: 700; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .cm__li { animation: none; } }

/* botão voltar no canto direito */
.volta-bar { display: none; }
@media (max-width: 959px) {
  .volta-bar { position: sticky; top: 0; z-index: 36; display: flex; justify-content: flex-end; height: 52px; margin: 0 -4px; padding: 4px 4px 0; pointer-events: none; }
  .volta { pointer-events: auto; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--borda); border-radius: 50%; background: var(--sup); color: var(--tinta); box-shadow: 0 4px 14px rgb(0 0 0 / 0.1); cursor: pointer; transition: transform 160ms var(--ios); }
  .volta:active { transform: scale(0.92); }
  .cm, .fm { padding-top: 0; }
}
.cm__chips { cursor: grab; touch-action: pan-x pan-y; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.cm__chips.arrastando { cursor: grabbing; -webkit-user-select: none; user-select: none; }

/* confirmação ao adicionar */
.cf { display: grid; justify-items: center; gap: 6px; padding: 6px 4px 4px; text-align: center; font-family: "IBM Plex Sans", Inter, system-ui, sans-serif; }
.cf__tit { margin-top: 10px; font-size: 1.5rem; font-weight: 700; letter-spacing: -0.03em; line-height: 1.2; }
.cf__sub { color: var(--suave); font-size: 0.9375rem; }
.cf__selo { width: 76px; height: 76px; }
.selo { width: 100%; height: 100%; overflow: visible; }
.selo__fundo { fill: #9BE3B7; } .selo__sombra { fill: #0B1F14; } .selo__ok { fill: none; stroke: #1B9B58; stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; }
.cf__selo--leve { animation: cf-pop 500ms cubic-bezier(0.34, 1.56, 0.64, 1); }
.cf__selo--sucesso { width: 96px; height: 96px; animation: cf-pop 650ms cubic-bezier(0.34, 1.56, 0.64, 1); }
.cf__selo--sucesso .selo__fundo { fill: #1FA45B; } .cf__selo--sucesso .selo__ok { stroke: #FFFFFF; stroke-width: 8; animation: cf-traco 500ms ease-out 300ms backwards; }
@keyframes cf-pop { from { transform: scale(0.2) rotate(-25deg); opacity: 0; } }
@keyframes cf-traco { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.cf__tab { display: grid; width: 100%; margin: 14px 0 6px; padding: 4px 14px; border: 1px solid var(--borda); border-radius: 18px; text-align: left; }
.cf__tab div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; }
.cf__tab div + div { border-top: 1px solid var(--borda); }
.cf__tab dt { color: var(--suave); font-size: 0.875rem; } .cf__tab dd { margin: 0; max-width: 60%; font-size: 1rem; font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.cf__ok { width: 100%; min-height: 56px; margin-top: 6px; border: 0; border-radius: 999px; background: #0B0B0F; color: #FFFFFF; font: inherit; font-size: 1.0625rem; font-weight: 700; cursor: pointer; transition: transform 160ms var(--ios); }
.cf__ok:active { transform: scale(0.97); } .cf__ok--p { width: auto; padding: 0 36px; min-height: 48px; margin-top: 16px; }
.cf__volta { min-height: 44px; border: 0; background: none; color: var(--suave); font: inherit; font-size: 0.9375rem; font-weight: 600; cursor: pointer; }
.cf__aviao { width: 150px; height: 110px; margin-top: 6px; }
.aviao { width: 100%; height: 100%; animation: cf-voa 1000ms ease-in-out infinite alternate; }
.aviao__rastro path { fill: none; stroke: #0B1F14; stroke-width: 2.5; stroke-linecap: round; animation: cf-rastro 700ms linear infinite; }
@keyframes cf-voa { from { transform: translate(-6px, 6px) rotate(-3deg); } to { transform: translate(8px, -8px) rotate(3deg); } }
@keyframes cf-rastro { from { opacity: 0.2; transform: translateX(-6px); } to { opacity: 1; transform: none; } }
:root[data-tema="escuro"] .cf__ok { background: #FFFFFF; color: #000000; }
@media (prefers-reduced-motion: reduce) { .cf__selo, .aviao, .aviao__rastro path, .selo__ok { animation: none; } }

/* ===== Menu da conta (imagem 2) ===== */
.ilha__painel-in .mc { padding: 8px; border-radius: 28px; background: #FCFCFC; color: #111114; box-shadow: 0 0 0 1px rgb(0 0 0 / 0.05), 0 18px 40px rgb(0 0 0 / 0.2); font-family: "IBM Plex Sans", Inter, system-ui, sans-serif; }
.mc__topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 16px 16px 20px; border: 1px solid #ECECEF; border-radius: 22px; background: #FFFFFF; color: inherit; text-decoration: none; }
.mc__quem { display: grid; gap: 2px; min-width: 0; } .mc__quem b { overflow: hidden; font-size: 1.1875rem; font-weight: 700; letter-spacing: -0.02em; text-overflow: ellipsis; white-space: nowrap; } .mc__quem span { overflow: hidden; color: #8A8A93; font-size: 0.9375rem; text-overflow: ellipsis; white-space: nowrap; }
.mc__anel { display: grid; place-items: center; flex: none; width: 62px; height: 62px; border-radius: 50%; background: conic-gradient(from 200deg, #FF7AAE, #FFB84D, #30D158, #7AA2FF, #FF7AAE); }
.mc__anel .avatar { width: 54px; height: 54px; border: 3px solid #FFFFFF; font-size: 1rem; }
.mc__lin { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 54px; margin-top: 4px; padding: 0 12px; border: 0; border-radius: 16px; background: none; color: #1B1B1F; font: inherit; font-size: 1.0625rem; font-weight: 500; text-align: left; text-decoration: none; cursor: pointer; transition: background-color 160ms, transform 160ms var(--ios); }
.mc__lin:active { transform: scale(0.98); }
.mc__ic { display: grid; place-items: center; flex: none; width: 26px; height: 26px; color: #1B1B1F; } .mc__ic svg { width: 22px; height: 22px; }
.mc__rot { flex: 1; min-width: 0; }
.mc__pro { display: inline-flex; align-items: center; gap: 4px; padding: 5px 10px; border: 1px solid #8BE0A3; border-radius: 10px; background: #A6F4B8; color: #0B4A22; font-size: 0.8125rem; font-weight: 800; letter-spacing: 0.02em; }
.mc__val { color: #8A8A93; font-size: 0.9375rem; font-weight: 500; }
.mc__fio { margin: 8px 6px; border: 0; border-top: 1px solid #ECECEF; }
:root[data-tema="escuro"] .ilha__painel-in .mc { background: #1C1C1E; color: #FFFFFF; }
:root[data-tema="escuro"] .mc__topo { border-color: #2C2C2E; background: #242426; }
:root[data-tema="escuro"] .mc__lin, :root[data-tema="escuro"] .mc__ic { color: #FFFFFF; }
:root[data-tema="escuro"] .mc__fio { border-color: #2C2C2E; }

/* ===== Minha conta (imagem 3) ===== */
.p3 { display: none; }
@media (max-width: 959px) { .pf-grande { display: none; } .p3 { display: block; } .conteudo:has(.p3) .topo-app { display: none; } }
.p3 { padding-bottom: 140px; font-family: "IBM Plex Sans", Inter, system-ui, sans-serif; }
.p3__topo { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; margin-bottom: 14px; }
.p3__topo h1 { font-size: 1.125rem; font-weight: 600; text-align: center; letter-spacing: -0.01em; }
.p3__user { display: flex; align-items: center; gap: 14px; width: 100%; padding: 14px 16px; border: 0; border-radius: 22px; background: #FFFFFF; color: inherit; font: inherit; text-align: left; cursor: pointer; box-shadow: 0 1px 0 rgb(0 0 0 / 0.03); }
.p3__av { display: grid; place-items: center; flex: none; width: 52px; height: 52px; overflow: hidden; border-radius: 50%; background: #00873A; color: #FFFFFF; font-weight: 700; } .p3__av img { width: 100%; height: 100%; object-fit: cover; }
.p3__id { display: grid; flex: 1; min-width: 0; gap: 1px; } .p3__id b { font-size: 1.0625rem; font-weight: 700; } .p3__id span { overflow: hidden; color: #8A8A93; font-size: 0.875rem; text-overflow: ellipsis; white-space: nowrap; }
.p3__chev { display: grid; place-items: center; flex: none; color: #55555C; }
.p3__plano { display: flex; align-items: center; gap: 12px; margin: 14px 0; padding: 18px 16px; border-radius: 24px; background: linear-gradient(120deg, #101012, #2A2A2E); color: #FFFFFF; text-decoration: none; }
.p3__estrela { width: 34px; height: 34px; flex: none; } .p3__plano-txt { display: grid; flex: 1; gap: 4px; min-width: 0; } .p3__plano-txt b { font-size: 1.0625rem; font-weight: 700; } .p3__plano-txt span { color: rgb(255 255 255 / 0.72); font-size: 0.8125rem; line-height: 1.4; }
.p3__plano-bt { display: inline-flex; align-items: center; gap: 2px; flex: none; padding: 8px 12px; border: 1px solid rgb(255 255 255 / 0.3); border-radius: 999px; background: rgb(255 255 255 / 0.14); font-size: 0.8125rem; font-weight: 600; } .p3__plano-bt svg { width: 14px; height: 14px; }
.p3__grupo { margin-top: 14px; padding: 4px 16px; border-radius: 24px; background: #FFFFFF; }
.p3__row { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 56px; padding: 0; border: 0; background: none; color: #1B1B1F; font: inherit; font-size: 1rem; font-weight: 500; text-align: left; text-decoration: none; cursor: pointer; position: relative; }
.p3__row + .p3__row { border-top: 1px solid #EDEDF0; }
.p3__ic { display: grid; place-items: center; flex: none; width: 24px; height: 24px; color: #6A6A72; } .p3__ic .ic { width: 22px; height: 22px; stroke-width: 1.6; }
.p3__rot { flex: 1; min-width: 0; } .p3__val { max-width: 48%; overflow: hidden; color: #8A8A93; font-size: 0.875rem; text-overflow: ellipsis; white-space: nowrap; }
.p3__sw { position: relative; flex: none; width: 48px; height: 28px; border-radius: 999px; background: #D5D5DA; transition: background-color 220ms; } .p3__sw i { position: absolute; top: 2px; left: 2px; width: 24px; height: 24px; border-radius: 50%; background: #FFFFFF; box-shadow: 0 1px 4px rgb(0 0 0 / 0.3); transition: transform 260ms cubic-bezier(0.34, 1.56, 0.64, 1); } .p3__sw--on { background: #34A862; } .p3__sw--on i { transform: translateX(20px); }
.p3 > * { animation: seq-entra 440ms var(--suave-sai) backwards; } .p3 > :nth-child(2) { animation-delay: 60ms; } .p3 > :nth-child(3) { animation-delay: 120ms; } .p3 > :nth-child(n+4) { animation-delay: 180ms; }
body:has(.p3) { background: #F3F3F5; }
:root[data-tema="escuro"] body:has(.p3) { background: #000; }
:root[data-tema="escuro"] .p3__user, :root[data-tema="escuro"] .p3__grupo { background: #1C1C1E; }
:root[data-tema="escuro"] .p3__row { color: #FFFFFF; }
:root[data-tema="escuro"] .p3__row + .p3__row { border-color: #2C2C2E; } :root[data-tema="escuro"] .p3__sw { background: #48484A; }
@media (prefers-reduced-motion: reduce) { .p3 > * { animation: none; } }