/* ═══════════════════════════════════════════════════════════════════════
   FREEL Social — rede.css · a "cara" do Protótipo FREEL Social v2 (28/09/2026)

   Base: freel-social-prototipo.html (telas Início, Perfil e Primeiro acesso) e
   "Plano FREEL Social v2 (28/09/2026)", seção 6 — Sistema visual compacto:
     • escala em rem (--fs-11 … --fs-24): quem aumenta a letra do navegador vê o FREEL crescer;
     • contraste ≥ 4,5:1 — cinza de metadado nunca mais claro que #5B6574 sobre branco;
     • piso de 11,5 px (só selos e contadores em negrito);
     • alvo de toque ≥ 40 px no computador e ≥ 44 px no celular;
     • campos de digitar com 16 px (o iPhone não dá zoom sozinho).
   As classes do protótipo ganharam o prefixo "r-" porque .card, .row, .col, .nav e .badge
   já são do Bootstrap (que continua carregado para os pop-ups das telas antigas).
   A segunda metade deste arquivo deixa as telas antigas do Social (s-*) no mesmo tamanho de
   letra, para o Social inteiro ficar coerente (pedido: "tipografia compacta em todo o Social").
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  /* cores do protótipo */
  --r-bg: #F2F4F7; --r-card: #FFFFFF; --r-line: #DDE2E9; --r-line2: #EDF0F4; --r-soft: #F4F6F9;
  --r-ink: #1B2433; --r-text: #2B3545; --r-sub: #3E4858; --r-muted: #5B6574;
  --r-navy: #173A63; --r-blue: #1F5FA8; --r-blue-soft: #E6EFFA; --r-cta: #B84A12; --r-cta-h: #9C3D0D;
  --r-teal: #0B6E64; --r-teal-soft: #E3F3EE; --r-cover: #DCE6F2; --r-input: #EEF2F7;
  /* Plano §6 — família e escala */
  --r-font: 'Source Sans 3', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fs-11: .71875rem;  /* 11,5px  selos, contadores */
  --fs-12: .75rem;     /* 12px    metadados */
  --fs-13: .8125rem;   /* 13px    chips, botões */
  --fs-14: .875rem;    /* 14px    corpo, nomes */
  --fs-15: .9375rem;   /* 15px    título do post */
  --fs-16: 1rem;       /* 16px    título de card */
  --fs-20: 1.25rem;    /* 20px    título de página */
  --fs-24: 1.5rem;     /* 24px    nome no perfil */
  --lh-body: 1.42; --lh-meta: 1.33; --lh-title: 1.25;
}

/* ───────────── base do Social (as duas cascas) ───────────── */
/* casca nova (membro logado): a página inteira; casca do portal (visitante / "em breve"): só o miolo,
   para o menu e o rodapé do portal continuarem com a letra do portal */
body.social.r-app, body.social:not(.r-app) main { font-family: var(--r-font); font-size: var(--fs-14); line-height: var(--lh-body); color: var(--r-ink); -webkit-font-smoothing: antialiased; }
body.social.r-app { background: var(--r-bg); margin: 0; }
body.r-app a { color: var(--r-blue); text-decoration: none; }
body.r-app a:hover { text-decoration: underline; }
body.social input, body.social select, body.social textarea { font-size: 16px; font-family: inherit; }
body.social button { font-family: inherit; }
body.r-app button:focus-visible, body.r-app a:focus-visible, body.r-app input:focus-visible, body.r-app select:focus-visible, body.r-app textarea:focus-visible { outline: 2px solid var(--r-cta); outline-offset: 2px; }
@media (max-width: 760px) { body.social.r-app, body.social:not(.r-app) main { font-size: var(--fs-15); } }
.r-wrap { max-width: 1128px; margin: 0 auto; padding: 0 16px; }
.r-card { background: var(--r-card); border: 1px solid var(--r-line); border-radius: 8px; }
.r-av { position: relative; display: inline-flex; align-items: center; justify-content: center; color: #FFFFFF; font-weight: 700; flex-shrink: 0; overflow: hidden; background: #1F5FA8; }
.r-av img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.r-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ───────────── barra de cima (protótipo: .top) ───────────── */
.r-top { position: sticky; top: 0; z-index: 1030; background: var(--r-card); border-bottom: 1px solid var(--r-line); }
.r-top .r-wrap { height: 56px; display: flex; align-items: center; gap: 12px; }
.r-logo { display: flex; align-items: center; gap: 8px; color: var(--r-navy) !important; font-weight: 700; font-size: 1.0625rem; white-space: nowrap; }
.r-logo:hover { text-decoration: none !important; }
.r-logo .mk { width: 34px; height: 34px; border-radius: 7px; background: #173A63; color: #FFFFFF; display: flex; align-items: center; justify-content: center; font-size: 1.125rem; }
.r-logo b { color: var(--r-cta); }
.r-search { margin: 0 0 0 8px; width: 280px; height: 34px; background: var(--r-input); border-radius: 6px; display: flex; align-items: center; gap: 8px; padding: 0 12px; color: var(--r-muted); }
.r-search input { border: 0; background: transparent; outline: none; font-size: var(--fs-14) !important; width: 100%; color: var(--r-ink); }
.r-nav { display: flex; height: 56px; margin-left: auto; }
.r-nav > a, .r-nav > .dropdown > a { width: 78px; height: 56px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--r-muted) !important; font-size: var(--fs-12); position: relative; border-bottom: 2px solid transparent; }
.r-nav > a:hover, .r-nav > .dropdown > a:hover { color: var(--r-ink) !important; text-decoration: none !important; }
.r-nav a.on { color: var(--r-ink) !important; border-bottom-color: var(--r-ink); }
.r-nav .r-badge { position: absolute; top: 6px; right: 18px; background: var(--r-cta); color: #FFFFFF; font-size: var(--fs-11); font-weight: 700; border-radius: 9px; padding: 0 5px; line-height: 16px; }
.r-nav .r-me { border-left: 1px solid var(--r-line); }
.r-nav .r-me .r-av { width: 24px; height: 24px; border-radius: 12px; font-size: 11px; }
.r-nav .dropdown-menu { font-size: var(--fs-14); min-width: 240px; border-color: var(--r-line); border-radius: 8px; padding: 6px 0; box-shadow: 0 8px 24px rgba(27,36,51,.12); }
.r-nav .dropdown-item { padding: 8px 16px; color: var(--r-ink); min-height: 40px; display: flex; align-items: center; gap: 8px; }
.r-nav .dropdown-item:hover { text-decoration: none; background: var(--r-soft); }
.r-nav .r-eu-cab { padding: 8px 16px 10px; display: flex; gap: 10px; align-items: center; border-bottom: 1px solid var(--r-line2); margin-bottom: 4px; }
.r-nav .r-eu-cab .r-av { width: 44px; height: 44px; border-radius: 22px; font-size: 15px; }
.r-nav .r-eu-cab b { display: block; font-size: var(--fs-14); color: var(--r-ink); }
.r-nav .r-eu-cab span { display: block; font-size: var(--fs-12); color: var(--r-muted); line-height: var(--lh-meta); }
@media (max-width: 900px) { .r-search { display: none; } .r-nav > a, .r-nav > .dropdown > a { width: 60px; } .r-nav .r-lb { display: none; } .r-nav .r-badge { right: 12px; } }
@media (max-width: 760px) {
  .r-top .r-wrap { gap: 8px; }
  .r-logo .r-logo-tx { display: none; }
  .r-nav { flex: 1; justify-content: space-between; }
  .r-nav > a, .r-nav > .dropdown > a { width: auto; min-width: 44px; flex: 1; }
  .r-nav > .dropdown { flex: 1; display: flex; }
  .r-nav .r-badge { right: calc(50% - 20px); }
}

/* ───────────── barra "Estou aqui para" (protótipo: .modes) ───────────── */
.r-modes { background: var(--r-card); border-bottom: 1px solid var(--r-line); }
.r-modes .r-wrap { min-height: 52px; display: flex; align-items: center; gap: 8px; overflow-x: auto; padding-top: 8px; padding-bottom: 8px; scrollbar-width: none; }
.r-modes .r-wrap::-webkit-scrollbar { display: none; }
.r-modes .lb { font-size: var(--fs-13); color: var(--r-muted); font-weight: 600; white-space: nowrap; margin-right: 4px; }
.r-pill { height: 36px; padding: 0 14px; border-radius: 18px; border: 1px solid #B9C3D1; background: var(--r-card); color: var(--r-ink); font-size: .84375rem; font-weight: 600; white-space: nowrap; cursor: pointer; }
.r-pill:hover { border-color: var(--r-navy); }
.r-pill[aria-pressed="true"] { background: #173A63; border-color: #173A63; color: #FFFFFF; }
.r-pill:disabled { opacity: .7; cursor: progress; }
.r-modes .hint { margin-left: auto; font-size: .78125rem; color: var(--r-muted); white-space: nowrap; padding-left: 12px; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1100px) { .r-modes .hint { display: none; } }
@media (max-width: 760px) { .r-pill { height: 44px; border-radius: 22px; } }

/* ───────────── grade do Início ───────────── */
.r-grid { display: grid; grid-template-columns: 225px minmax(0, 1fr) 300px; gap: 24px; padding-top: 20px; padding-bottom: 40px; align-items: start; }
@media (max-width: 1060px) { .r-grid { grid-template-columns: 225px minmax(0, 1fr); } .r-col-r { grid-column: 1 / -1; } }
@media (max-width: 760px) { .r-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; padding-top: 12px; } .r-col-l { order: 2; } .r-col-r { order: 3; } }
.r-col { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.r-page { padding-top: 20px; padding-bottom: 40px; }

/* painel esquerdo */
.r-me-card { overflow: hidden; }
.r-me-card .cov { height: 56px; background: var(--r-cover); }
.r-me-card .in { padding: 0 14px 14px; }
.r-me-card .r-av { width: 64px; height: 64px; border-radius: 32px; border: 3px solid var(--r-card); margin-top: -34px; font-size: 1.375rem; }
.r-me-card .nm { display: flex; align-items: center; gap: 4px; margin-top: 8px; font-weight: 600; font-size: var(--fs-16); }
.r-me-card .nm a { color: inherit; }
.r-me-card .hd { font-size: .78125rem; color: var(--r-sub); line-height: 1.35; }
.r-me-card .ct { font-size: var(--fs-12); color: var(--r-muted); margin-top: 2px; }
.r-me-card .r-selo { margin-top: 6px; }
.r-box { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.r-box h3 { margin: 0; font-size: .84375rem; font-weight: 600; color: var(--r-ink); }
.r-linha { display: flex; justify-content: space-between; gap: 8px; font-size: .78125rem; }
.r-linha span { color: var(--r-sub); } .r-linha b { color: var(--r-blue); }
.r-note { font-size: var(--fs-12); color: var(--r-sub); background: var(--r-soft); border-radius: 6px; padding: 8px 10px; }
.r-note a { font-weight: 600; }
.r-box > a.r-mais-l { font-size: var(--fs-13); font-weight: 600; }
.r-links { padding: 10px 14px; display: flex; flex-direction: column; gap: 6px; font-size: .78125rem; }
.r-links a { color: var(--r-ink) !important; display: flex; align-items: center; gap: 8px; min-height: 22px; }
@media (max-width: 760px) { .r-links a { min-height: 40px; } }

/* caixa de publicar */
.r-composer { padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.r-composer .l1 { display: flex; gap: 10px; align-items: center; }
.r-composer .r-av { width: 44px; height: 44px; border-radius: 22px; font-size: 15px; }
.r-composer .open { flex-grow: 1; height: 44px; border-radius: 22px; border: 1px solid #A9B4C4; background: var(--r-card); text-align: left; padding: 0 16px; font-size: var(--fs-14); font-weight: 600; color: var(--r-sub) !important; display: flex; align-items: center; min-width: 0; }
.r-composer .open span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.r-composer .open:hover { background: var(--r-soft); text-decoration: none !important; }
.r-composer .l2 { display: flex; gap: 6px; }
.r-tbtn { flex: 1; min-height: 40px; border: 0; background: transparent; border-radius: 6px; font-size: var(--fs-13); font-weight: 600; color: var(--r-sub) !important; display: flex; align-items: center; justify-content: center; gap: 6px; }
.r-tbtn:hover { background: var(--r-soft); text-decoration: none !important; }
@media (max-width: 480px) { .r-tbtn span { display: none; } .r-tbtn { min-height: 44px; } }

/* chips de seção e ordenação */
.r-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.r-chip { height: 32px; padding: 0 12px; border-radius: 16px; border: 1px solid #B9C3D1; background: var(--r-card); color: var(--r-sub); font-size: var(--fs-13); font-weight: 600; cursor: pointer; white-space: nowrap; }
.r-chip:hover { border-color: var(--r-teal); }
.r-chip[aria-pressed="true"] { background: #0B6E64; border-color: #0B6E64; color: #FFFFFF; }
@media (max-width: 760px) { .r-chips.r-rola { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; } .r-chip { height: 40px; border-radius: 20px; } }
.r-sort { display: flex; align-items: center; gap: 8px; font-size: var(--fs-12); color: var(--r-muted); }
.r-sort::before { content: ""; flex-grow: 1; height: 1px; background: var(--r-line); }
.r-sort b { color: var(--r-ink); }

/* ───────────── cartão do post (protótipo: .post) ───────────── */
.r-post { overflow: visible; }
.r-post .why { padding: 8px 14px; border-bottom: 1px solid var(--r-line2); font-size: var(--fs-12); color: var(--r-muted); display: flex; align-items: center; gap: 6px; }
.r-post .why svg { flex-shrink: 0; }
.r-post .hd { padding: 12px 14px 0; display: flex; gap: 10px; }
.r-post .hd .r-av { width: 48px; height: 48px; border-radius: 24px; font-size: var(--fs-16); }
.r-post .hd > a:first-child:hover { text-decoration: none; }
.r-post .who { flex-grow: 1; min-width: 0; }
.r-post .nmr { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.r-post .nm { font-weight: 600; color: var(--r-ink) !important; font-size: var(--fs-14); }
.r-post .rl { font-size: .78125rem; color: var(--r-sub); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.r-post .ct { font-size: var(--fs-12); color: var(--r-muted); line-height: var(--lh-meta); }
.r-post .ct a { color: inherit !important; }
.r-post .dir { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex-shrink: 0; }
.r-selo { display: inline-flex; align-items: center; gap: 3px; font-size: var(--fs-11); font-weight: 700; color: var(--r-teal); background: var(--r-teal-soft); border-radius: 4px; padding: 0 6px; line-height: 18px; white-space: nowrap; }
.r-type { align-self: flex-end; font-size: var(--fs-11); font-weight: 700; border-radius: 4px; padding: 1px 8px; white-space: nowrap; }
.r-type-oportunidade { background: #EFEAFB; color: #4F3699; } .r-type-case { background: #E3F3EE; color: #0B6E64; }
.r-type-conhecimento { background: #E6EFFA; color: #1F5FA8; } .r-type-anuncio { background: #FCEDE3; color: #A0400E; }
.r-type-parceria { background: #E2F0F5; color: #1A5F77; } .r-type-evento { background: #FBE9EF; color: #96304F; }
.r-post .bd { padding: 10px 14px 0; display: flex; flex-direction: column; gap: 4px; }
.r-post .tt { font-weight: 700; font-size: .96875rem; line-height: 1.3; color: var(--r-ink) !important; overflow-wrap: anywhere; }
.r-post .tx { color: var(--r-text); overflow-wrap: anywhere; margin: 0; }
.r-post .ex { font-size: .78125rem; color: var(--r-sub); background: var(--r-soft); border-radius: 6px; padding: 6px 10px; margin-top: 4px; overflow-wrap: anywhere; }
.r-post .capa { display: block; margin: 10px 0 0; aspect-ratio: 16 / 9; background: var(--r-soft); overflow: hidden; }
.r-post .capa img { width: 100%; height: 100%; object-fit: cover; display: block; }
.r-post .st { padding: 8px 14px 0; font-size: var(--fs-12); color: var(--r-muted); }
.r-post .ac { margin: 6px 8px 0; border-top: 1px solid var(--r-line2); padding: 4px 0; display: flex; align-items: center; gap: 2px; flex-wrap: wrap; }
.r-abtn { height: 40px; padding: 0 12px; border: 0; background: transparent; border-radius: 6px; font-size: var(--fs-13); font-weight: 600; color: var(--r-sub) !important; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.r-abtn:hover { background: var(--r-soft); text-decoration: none !important; }
.r-abtn[aria-pressed="true"] { color: var(--r-blue) !important; font-weight: 700; }
.r-abtn[aria-pressed="true"] svg { fill: var(--r-blue-soft); }
.r-abtn:disabled { cursor: default; }
.r-cta { min-height: 40px; padding: 0 16px; margin: 4px 6px 4px auto; border-radius: 20px; border: 0; background: var(--r-cta); color: #FFFFFF !important; font-size: .84375rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer; white-space: nowrap; }
.r-cta:hover { background: var(--r-cta-h); text-decoration: none !important; }
.r-cta.r-cta-sec { background: var(--r-card); color: var(--r-blue) !important; border: 1px solid var(--r-blue); }
.r-cta.r-cta-sec:hover { background: var(--r-blue-soft); }
.r-cta.r-cta-ok { background: var(--r-teal-soft); color: var(--r-teal) !important; cursor: default; }
.r-mnu { margin-left: 2px; }
.r-mnu > button { width: 40px; height: 40px; border: 0; background: transparent; border-radius: 20px; color: var(--r-muted); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.r-mnu > button:hover { background: var(--r-soft); color: var(--r-ink); }
.r-mnu .dropdown-menu { font-size: var(--fs-14); border-color: var(--r-line); border-radius: 8px; box-shadow: 0 8px 24px rgba(27,36,51,.12); }
.r-mnu .dropdown-item { min-height: 40px; display: flex; align-items: center; gap: 8px; color: var(--r-ink); }
@media (max-width: 480px) { .r-abtn span { display: none; } .r-abtn { height: 44px; padding: 0 10px; } .r-cta { min-height: 44px; } }
.r-status { font-size: var(--fs-11); font-weight: 700; padding: 1px 8px; border-radius: 4px; background: #FEF3C7; color: #92400E; white-space: nowrap; }
.r-status.mute { background: var(--r-soft); color: var(--r-sub); }
.r-empty { padding: 28px 20px; text-align: center; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.r-empty b { font-size: var(--fs-15); } .r-empty p { margin: 0; font-size: var(--fs-13); color: var(--r-muted); }
.r-empty .r-cta { margin: 4px 0 0; }
.r-mais { display: flex; justify-content: center; padding: 6px 0; }
.r-mais button { min-height: 40px; padding: 0 18px; border-radius: 20px; border: 1px solid var(--r-blue); background: var(--r-card); color: var(--r-blue); font-weight: 700; font-size: var(--fs-13); cursor: pointer; }
.r-carregando { opacity: .55; pointer-events: none; transition: opacity .15s; }

/* ───────────── coluna direita ───────────── */
.r-rbox { padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.r-rbox .h { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.r-rbox h3 { margin: 0; font-size: var(--fs-15); font-weight: 700; color: var(--r-ink); }
.r-rbox .sc { font-size: var(--fs-11); color: var(--r-muted); text-align: right; }
.r-ri { display: flex; gap: 10px; align-items: flex-start; }
.r-ri .r-av { width: 36px; height: 36px; border-radius: 6px; font-size: var(--fs-13); }
.r-ri > div { min-width: 0; flex: 1; }
.r-ri .t { font-weight: 600; font-size: .84375rem; color: var(--r-ink) !important; line-height: 1.3; display: block; overflow-wrap: anywhere; }
.r-ri .s { font-size: var(--fs-12); color: var(--r-sub); display: block; }
.r-ri .m { font-size: var(--fs-11); color: var(--r-teal); font-weight: 600; display: block; }
.r-ri .r-mini { margin-top: 6px; }
.r-rbox .more { font-size: var(--fs-13); font-weight: 600; border-top: 1px solid var(--r-line2); padding-top: 8px; }
.r-rbox .vazio { font-size: var(--fs-13); color: var(--r-muted); margin: 0; }
.r-trend { display: flex; flex-direction: column; gap: 2px; }
.r-trend a { font-weight: 600; font-size: var(--fs-13); color: var(--r-ink) !important; }
.r-trend span { font-size: var(--fs-11); color: var(--r-muted); }
.r-foot { font-size: var(--fs-11); color: var(--r-muted); display: flex; flex-wrap: wrap; gap: 4px 12px; justify-content: center; padding: 4px 8px; }
.r-foot a { color: var(--r-muted) !important; }
.r-rodape { border-top: 1px solid var(--r-line); background: var(--r-card); margin-top: 8px; }
.r-rodape .r-foot { padding: 14px 16px; }

/* botões pequenos (listas de pessoas) */
.r-mini { min-height: 32px; padding: 0 12px; border-radius: 16px; border: 1px solid var(--r-blue); background: var(--r-card); color: var(--r-blue) !important; font-size: var(--fs-13); font-weight: 700; display: inline-flex; align-items: center; gap: 4px; cursor: pointer; white-space: nowrap; }
.r-mini:hover { background: var(--r-blue-soft); text-decoration: none !important; }
.r-mini.cheio { background: var(--r-blue); color: #fff !important; }
.r-mini.cheio:hover { background: var(--r-navy); }
.r-mini.cinza { border-color: #8793A6; color: var(--r-sub) !important; }
.r-mini:disabled { opacity: .6; cursor: default; }
@media (max-width: 760px) { .r-mini { min-height: 40px; } }

/* ───────────── perfil (protótipo: tela 2) ───────────── */
.r-pgrid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; padding-top: 24px; padding-bottom: 40px; align-items: start; }
@media (max-width: 900px) { .r-pgrid { grid-template-columns: minmax(0, 1fr); gap: 12px; padding-top: 12px; } }
.r-phead { overflow: hidden; }
.r-phead .cov { height: 150px; background: var(--r-cover); position: relative; }
.r-phead .area { position: absolute; right: 20px; bottom: 16px; left: 180px; margin-left: auto; width: fit-content; max-width: calc(100% - 200px); background: var(--r-card); border-radius: 6px; padding: 6px 10px; font-size: .78125rem; font-weight: 600; color: var(--r-navy); }
.r-phead .in { padding: 0 24px 20px; }
.r-phead .big { width: 132px; height: 132px; border-radius: 66px; border: 4px solid var(--r-card); margin-top: -84px; font-size: 2.75rem; position: relative; z-index: 1; }
.r-phead .top2 { display: flex; justify-content: space-between; gap: 24px; margin-top: 8px; flex-wrap: wrap; }
.r-phead h1 { margin: 0; font-size: var(--fs-24); line-height: 1.2; font-weight: 700; color: var(--r-ink); }
.r-phead .tl { font-size: var(--fs-16); color: var(--r-ink); }
.r-phead .mt { font-size: var(--fs-13); color: var(--r-muted); }
.r-phead .org { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-13); color: var(--r-sub); max-width: 280px; }
.r-phead .org b { color: var(--r-ink); }
.r-phead .org a { color: var(--r-ink) !important; font-weight: 700; }
@media (max-width: 620px) {
  .r-phead .cov { height: 96px; }
  .r-phead .area { position: static; display: block; max-width: none; margin: 8px 16px 0; width: auto; border: 1px solid var(--r-line); }
  .r-phead .in { padding: 0 16px 16px; }
  .r-phead .big { width: 96px; height: 96px; margin-top: -48px; font-size: 2rem; }
}
.r-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.r-bdg { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 0 10px; border-radius: 6px; font-weight: 600; font-size: var(--fs-13); background: var(--r-blue-soft); color: var(--r-blue); border: 0; cursor: help; }
.r-bdg.ok { background: var(--r-teal-soft); color: var(--r-teal); font-weight: 700; }
.r-bdg.n { background: var(--r-soft); color: var(--r-sub); }
.r-bdg.f { background: #FCEDE3; color: #A0400E; }
.r-pbtns { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.r-b1, .r-b2, .r-b3 { min-height: 40px; padding: 0 20px; border-radius: 20px; font-weight: 700; font-size: var(--fs-15); display: inline-flex; align-items: center; gap: 6px; cursor: pointer; white-space: nowrap; }
.r-b1 { border: 0; background: var(--r-cta); color: #FFFFFF !important; }
.r-b1:hover { background: var(--r-cta-h); text-decoration: none !important; }
.r-b2 { border: 1px solid var(--r-blue); background: var(--r-card); color: var(--r-blue) !important; }
.r-b2:hover { background: var(--r-blue-soft); text-decoration: none !important; }
.r-b2.on { background: var(--r-blue); color: #fff !important; }
.r-b3 { border: 1px solid var(--r-muted); background: var(--r-card); color: var(--r-sub) !important; }
.r-b3:hover { background: var(--r-soft); text-decoration: none !important; }
@media (max-width: 760px) { .r-b1, .r-b2, .r-b3 { min-height: 44px; } }
.r-sec { padding: 18px 24px; display: flex; flex-direction: column; gap: 10px; }
@media (max-width: 620px) { .r-sec { padding: 16px; } }
.r-sec .h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.r-sec h2 { margin: 0; font-size: 1.1875rem; font-weight: 700; color: var(--r-ink); }
.r-sec .h > span { font-size: .78125rem; color: var(--r-muted); }
.r-sec .h .r-mini { margin-left: auto; }
.r-sec > p.vazio { margin: 0; color: var(--r-muted); font-size: var(--fs-13); }
.r-sec .sobre { white-space: pre-wrap; color: var(--r-text); margin: 0; overflow-wrap: anywhere; }
.r-deliv { display: flex; gap: 12px; padding: 12px 0; border-top: 1px solid var(--r-line2); }
.r-deliv .r-av { width: 44px; height: 44px; border-radius: 6px; }
.r-deliv .c { flex-grow: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.r-deliv .l { display: flex; justify-content: space-between; gap: 12px; font-weight: 600; color: var(--r-ink); }
.r-deliv .l b { color: var(--r-teal); }
.r-deliv .m { font-size: .78125rem; color: var(--r-muted); }
.r-deliv .q { font-size: .84375rem; color: var(--r-text); overflow-wrap: anywhere; }
.r-deliv .acoes { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.r-g2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.r-g3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 620px) { .r-g2, .r-g3 { grid-template-columns: minmax(0, 1fr); } }
.r-sk { border: 1px solid var(--r-line2); border-radius: 6px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.r-sk b { font-weight: 600; color: var(--r-ink); }
.r-sk .e { font-size: .78125rem; color: var(--r-teal); font-weight: 600; } .r-sk .e.no { color: var(--r-muted); font-weight: 400; }
.r-sk .c { font-size: var(--fs-12); color: var(--r-muted); }
.r-sk .acoes { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.r-sk .dest { font-size: var(--fs-11); font-weight: 700; color: #A0400E; }
.r-pc { border: 1px solid var(--r-line2); border-radius: 6px; padding: 12px; display: flex; flex-direction: column; gap: 4px; color: var(--r-ink) !important; }
.r-pc:hover { text-decoration: none !important; background: var(--r-soft); }
.r-pc .k { font-size: var(--fs-11); font-weight: 700; }
.r-pc b { font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.r-pc span { font-size: var(--fs-12); color: var(--r-muted); }
.r-side { padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.r-side h2 { margin: 0; font-size: var(--fs-15); font-weight: 700; color: var(--r-ink); }
.r-pp { display: flex; gap: 10px; align-items: center; }
.r-pp .r-av { width: 36px; height: 36px; border-radius: 18px; font-size: var(--fs-13); }
.r-pp > div { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.r-pp > div > a { font-weight: 600; color: var(--r-ink) !important; }
.r-pp > div > span { font-size: var(--fs-12); color: var(--r-muted); overflow-wrap: anywhere; }
.r-kv { display: flex; justify-content: space-between; gap: 10px; font-size: var(--fs-13); }
.r-kv span { color: var(--r-sub); } .r-kv b { text-align: right; color: var(--r-ink); } .r-kv b.g { color: var(--r-teal); }
.r-prova { display: flex; gap: 8px; align-items: flex-start; font-size: var(--fs-13); }
.r-prova svg { flex-shrink: 0; margin-top: 2px; color: var(--r-teal); }
.r-prova b { display: block; color: var(--r-ink); }
.r-prova span { display: block; color: var(--r-muted); font-size: var(--fs-12); }
.r-rec { border-top: 1px solid var(--r-line2); padding: 12px 0 0; display: flex; gap: 10px; }
.r-rec:first-of-type { border-top: 0; }
.r-rec .r-av { width: 40px; height: 40px; border-radius: 20px; font-size: var(--fs-13); }
.r-rec .c { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.r-rec .c > a { font-weight: 600; color: var(--r-ink) !important; }
.r-rec .c > span { font-size: var(--fs-12); color: var(--r-muted); }
.r-rec .q { color: var(--r-text); white-space: pre-wrap; overflow-wrap: anywhere; margin-top: 4px; }
.r-rec .acoes { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.r-rec.pend { background: #FFFBEB; border-radius: 6px; padding: 10px; border: 1px solid #FDE68A; margin-top: 6px; }

/* ───────────── primeiro acesso (protótipo: tela 3) ───────────── */
.r-onb-bg { min-height: calc(100vh - 57px); display: flex; justify-content: center; padding: 24px 16px; }
.r-onb { width: 100%; max-width: 420px; display: flex; flex-direction: column; overflow: hidden; align-self: flex-start; }
.r-onb .in { padding: 20px 20px 0; display: flex; flex-direction: column; gap: 10px; }
.r-onb .st { display: flex; justify-content: space-between; align-items: center; }
.r-onb .st > span:last-child { font-size: .78125rem; color: var(--r-muted); }
.r-onb .st .r-logo { font-size: var(--fs-16); gap: 4px; }
.r-bar { height: 4px; background: var(--r-line2); border-radius: 2px; overflow: hidden; }
.r-bar div { width: 33%; height: 4px; background: var(--r-navy); transition: width .25s; }
.r-onb h1 { margin: 8px 0 0; font-size: 1.375rem; line-height: 1.2; font-weight: 700; color: var(--r-ink); }
.r-onb p { margin: 0; font-size: .84375rem; color: var(--r-sub); }
.r-goals { padding: 14px 20px 0; display: flex; flex-direction: column; gap: 8px; }
.r-goal { min-height: 56px; border-radius: 8px; border: 1px solid #C3CCD8; background: var(--r-card); padding: 9px 13px; text-align: left; display: flex; align-items: center; gap: 10px; color: var(--r-ink); cursor: pointer; width: 100%; }
.r-goal .bx { width: 20px; height: 20px; border-radius: 4px; border: 1.5px solid #8793A6; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.r-goal .bx svg { display: none; }
.r-goal[aria-pressed="true"] { border: 2px solid var(--r-navy); background: var(--r-blue-soft); padding: 8px 12px; }
.r-goal[aria-pressed="true"] .bx { background: #173A63; border-color: #173A63; }
.r-goal[aria-pressed="true"] .bx svg { display: block; }
.r-goal b { display: block; font-size: .90625rem; }
.r-goal .sb { display: block; font-size: .78125rem; color: var(--r-sub); }
.r-goal .pri { margin-left: auto; font-size: var(--fs-11); font-weight: 700; color: var(--r-navy); background: #fff; border: 1px solid var(--r-navy); border-radius: 4px; padding: 0 6px; line-height: 18px; white-space: nowrap; }
.r-topics { padding: 16px 20px 0; display: flex; flex-direction: column; gap: 8px; }
.r-topics h2 { margin: 0; font-size: var(--fs-15); font-weight: 700; color: var(--r-ink); }
.r-onb .ft { margin-top: 20px; padding: 12px 20px 20px; border-top: 1px solid var(--r-line2); display: flex; flex-direction: column; gap: 8px; }
.r-onb .ft > span { font-size: .78125rem; color: var(--r-sub); text-align: center; }
.r-onb .go { height: 46px; border-radius: 23px; border: 0; background: var(--r-cta); color: #FFFFFF; font-weight: 700; font-size: .96875rem; cursor: pointer; }
.r-onb .go:hover { background: var(--r-cta-h); }
.r-onb .go:disabled { opacity: .6; cursor: default; }
.r-onb .pular { text-align: center; font-size: var(--fs-13); }
.r-onb .r-erro { margin: 0; }

/* ───────────── páginas internas (Minha rede, Radar, Painel, Busca, Avisos) ───────────── */
.r-g-lado { display: grid; grid-template-columns: 225px minmax(0, 1fr); gap: 24px; padding-top: 20px; padding-bottom: 40px; align-items: start; }
@media (max-width: 760px) { .r-g-lado { grid-template-columns: minmax(0, 1fr); gap: 12px; padding-top: 12px; } }
.r-h1 { margin: 0; font-size: var(--fs-20); font-weight: 700; line-height: var(--lh-title); color: var(--r-ink); }
.r-h1-sub { margin: 2px 0 0; font-size: var(--fs-13); color: var(--r-muted); }
.r-lista { display: flex; flex-direction: column; }
.r-pessoa { display: flex; gap: 12px; align-items: center; padding: 12px 0; border-top: 1px solid var(--r-line2); }
.r-lista > .r-pessoa:first-child { border-top: 0; }
.r-pessoa .r-av { width: 56px; height: 56px; border-radius: 28px; font-size: var(--fs-16); }
.r-pessoa .c { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.r-pessoa .c > a { font-weight: 600; color: var(--r-ink) !important; font-size: var(--fs-14); }
.r-pessoa .c .s { font-size: .78125rem; color: var(--r-sub); overflow-wrap: anywhere; }
.r-pessoa .c .m { font-size: var(--fs-12); color: var(--r-muted); }
.r-pessoa .c .nota { font-size: .78125rem; color: var(--r-text); background: var(--r-soft); border-radius: 6px; padding: 6px 8px; margin-top: 4px; overflow-wrap: anywhere; }
.r-pessoa .acoes { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 520px) { .r-pessoa { flex-wrap: wrap; } .r-pessoa .acoes { width: 100%; justify-content: flex-start; padding-left: 68px; } }
.r-sug { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 1060px) { .r-sug { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .r-sug { grid-template-columns: minmax(0, 1fr); } }
.r-sug > div { border: 1px solid var(--r-line2); border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 12px 12px; gap: 4px; }
.r-sug .cov { height: 40px; background: var(--r-cover); width: calc(100% + 24px); margin: 0 -12px; }
.r-sug .r-av { width: 64px; height: 64px; border-radius: 32px; margin-top: -32px; border: 3px solid var(--r-card); font-size: 1.25rem; }
.r-sug a.n { font-weight: 600; color: var(--r-ink) !important; }
.r-sug .s { font-size: var(--fs-12); color: var(--r-sub); overflow-wrap: anywhere; }
.r-sug .m { font-size: var(--fs-11); color: var(--r-teal); font-weight: 600; }
.r-sug .r-mini { margin-top: auto; }
.r-menu-lado { padding: 8px 0; display: flex; flex-direction: column; }
.r-menu-lado a { display: flex; justify-content: space-between; gap: 8px; padding: 8px 14px; color: var(--r-ink) !important; font-size: var(--fs-13); min-height: 36px; align-items: center; }
.r-menu-lado a:hover { background: var(--r-soft); text-decoration: none !important; }
.r-menu-lado a b { color: var(--r-muted); font-weight: 600; }
.r-menu-lado h3 { font-size: var(--fs-14); font-weight: 700; margin: 4px 14px 6px; color: var(--r-ink); }
.r-radar-it { display: flex; gap: 12px; padding: 14px; border-top: 1px solid var(--r-line2); }
.r-radar-it:first-child { border-top: 0; }
.r-radar-it .r-av { width: 44px; height: 44px; border-radius: 6px; }
.r-radar-it .c { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.r-radar-it .t { font-weight: 700; font-size: var(--fs-15); color: var(--r-ink) !important; }
.r-radar-it .s { font-size: .78125rem; color: var(--r-sub); }
.r-radar-it .m { font-size: var(--fs-12); color: var(--r-teal); font-weight: 600; }
.r-radar-it .acoes { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.r-radar-it .acoes .r-cta { margin: 0; }
.r-match { height: 6px; border-radius: 3px; background: var(--r-line2); overflow: hidden; max-width: 220px; margin-top: 4px; }
.r-match div { height: 6px; background: var(--r-teal); }
.r-filtros { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 12px 14px; }
.r-filtros label { font-size: var(--fs-12); color: var(--r-muted); font-weight: 600; }
.r-filtros select { height: 40px; border: 1px solid #B9C3D1; border-radius: 6px; padding: 0 8px; background: var(--r-card); color: var(--r-ink); font-size: 16px; }
.r-filtros .r-chk { display: inline-flex; gap: 6px; align-items: center; font-size: var(--fs-13); color: var(--r-sub); min-height: 40px; }
.r-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 900px) { .r-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 480px) { .r-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.r-tile { padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.r-tile b { font-size: var(--fs-20); color: var(--r-ink); line-height: 1.2; }
.r-tile span { font-size: var(--fs-12); color: var(--r-muted); }
.r-tabela-box { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.r-tabela { width: 100%; border-collapse: collapse; font-size: var(--fs-13); min-width: 720px; }
.r-tabela th { text-align: right; font-size: var(--fs-12); color: var(--r-muted); font-weight: 600; padding: 10px 10px; border-bottom: 1px solid var(--r-line); white-space: nowrap; }
.r-tabela td { text-align: right; padding: 10px; border-bottom: 1px solid var(--r-line2); color: var(--r-text); white-space: nowrap; }
.r-tabela th:first-child, .r-tabela td:first-child { text-align: left; white-space: normal; min-width: 220px; }
.r-tabela td:first-child a { font-weight: 600; color: var(--r-ink) !important; }
.r-tabela td:first-child span { display: block; font-size: var(--fs-12); color: var(--r-muted); }
.r-seg { display: inline-flex; border: 1px solid #B9C3D1; border-radius: 18px; overflow: hidden; }
.r-seg a { padding: 0 14px; min-height: 36px; display: inline-flex; align-items: center; font-size: var(--fs-13); font-weight: 600; color: var(--r-sub) !important; }
.r-seg a.on { background: #173A63; color: #fff !important; }
.r-seg a:hover { text-decoration: none !important; }
.r-busca-form { display: flex; gap: 8px; padding: 12px 14px; }
.r-busca-form input { flex: 1; min-width: 0; height: 44px; border: 1px solid #B9C3D1; border-radius: 6px; padding: 0 12px; }
.r-busca-form button { flex: none; }
.r-aviso { font-size: var(--fs-13); padding: 10px 12px; border-radius: 6px; background: var(--r-blue-soft); color: var(--r-navy); }
.r-aviso.bad { background: #FEF2F2; color: #7F1D1D; }
.r-notif { display: flex; gap: 12px; padding: 12px 14px; border-top: 1px solid var(--r-line2); color: inherit !important; }
.r-notif:first-child { border-top: 0; }
.r-notif:hover { background: var(--r-soft); text-decoration: none !important; }
.r-notif.nova { background: #EEF4FC; }
.r-notif .ico { width: 40px; height: 40px; border-radius: 20px; background: var(--r-blue-soft); color: var(--r-navy); display: inline-flex; align-items: center; justify-content: center; flex: none; font-size: 1.05rem; }
.r-notif b { display: block; font-weight: 600; color: var(--r-ink); font-size: var(--fs-14); }
.r-notif span { display: block; color: var(--r-sub); font-size: var(--fs-13); overflow-wrap: anywhere; }
.r-notif small { display: block; color: var(--r-muted); font-size: var(--fs-12); }

/* pop-ups da rede (Bootstrap) no tom do protótipo */
.r-app .modal-content { border-radius: 8px; border: 1px solid var(--r-line); }
.r-app .modal-title { font-size: var(--fs-16) !important; font-weight: 700; font-family: var(--r-font) !important; }
.r-form label { display: block; font-weight: 600; font-size: var(--fs-13); color: var(--r-ink); margin: 0 0 4px; }
.r-form .campo { margin-bottom: 12px; }
.r-form input:not([type=checkbox]), .r-form select, .r-form textarea { width: 100%; border: 1px solid #B9C3D1; border-radius: 6px; padding: 8px 10px; min-height: 44px; background: #fff; color: var(--r-ink); }
.r-form textarea { min-height: 100px; line-height: 1.45; }
.r-form .dica { font-size: var(--fs-12); color: var(--r-muted); margin-top: 4px; }
.r-form .duas { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
@media (max-width: 480px) { .r-form .duas { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════════════════════════════
   AS TELAS ANTIGAS DO SOCIAL NO SISTEMA COMPACTO (Plano §6)
   Post, editor, oportunidades, grupo, salvos, avisos e "em breve": mesmas classes de
   sempre (s-*), agora com a escala --fs-* e a família do protótipo.
   ═══════════════════════════════════════════════════════════════════════ */
body.social .s-titulo, body.social .s-post h1, body.social .s-breve h1, body.social .s-grupo-capa h1,
body.social .s-card h2, body.social .s-card h3, body.social .modal-title, body.social .s-subnav .s-marca { font-family: var(--r-font); }
body.social .s-titulo { font-size: var(--fs-20); font-weight: 700; line-height: var(--lh-title); color: var(--r-ink); }
body.social .s-sub { font-size: var(--fs-13); color: var(--r-muted); margin-bottom: 12px; }
body.social .s-wrap { max-width: 1128px; }
body.r-app .s-wrap { padding: 20px 16px 40px; }
body.social .s-card, body.social .s-box, body.social .s-prop, body.social .s-vazio { border-radius: 8px; border-color: var(--r-line); box-shadow: none; }
body.social .s-card-in { padding: 14px; }
body.social .s-card h2, body.social .s-card h3 { font-size: .96875rem; margin: 10px 0 4px; }
body.social .s-resumo { font-size: var(--fs-14); line-height: var(--lh-body); color: var(--r-text); }
body.social .s-meta { font-size: var(--fs-12); color: var(--r-muted); line-height: var(--lh-meta); }
body.social .s-autor-nome { font-size: var(--fs-14); font-weight: 600; color: var(--r-ink); }
body.social .s-av { width: 48px; height: 48px; font-size: var(--fs-16); }
body.social .s-com .s-av { width: 32px; height: 32px; font-size: var(--fs-12); }
body.social .s-tipo { font-size: var(--fs-11); border-radius: 4px; padding: 2px 8px; }
body.social .s-extra { font-size: var(--fs-13); }
body.social .s-btn { font-size: var(--fs-13); min-height: 40px; padding: 0 16px; border-radius: 20px; border-width: 1px; }
body.social .s-btn-sm { min-height: 36px; padding: 0 12px; }
body.social .s-btn-pri { background: var(--r-blue); border-color: var(--r-blue); }
body.social .s-btn-pri:hover { background: var(--r-navy); border-color: var(--r-navy); }
body.social .s-btn-lar { background: var(--r-cta); }
body.social .s-btn-lar:hover { background: var(--r-cta-h); box-shadow: none; }
/* 06/10/2026 — AUDITORIA 05/10 (A-66): o botão laranja virava link (<a>) e herdava o AZUL dos links da
   página — "Publicar oportunidade" azul sobre laranja, ilegível. Texto branco sempre. */
body.social a.s-btn-lar, body.social a.s-btn-lar:hover, body.social a.s-btn-lar:visited, body.social a.s-btn-lar i { color: #fff; }
body.social .s-ic { font-size: var(--fs-13); min-height: 40px; color: var(--r-sub); }
body.social .s-ic.on { color: var(--r-blue); }
body.social .s-chip { font-size: var(--fs-13); min-height: 32px; }
body.social .s-chip.on { background: #173A63; border-color: #173A63; }
body.social .s-box h4 { font-size: var(--fs-15); font-weight: 700; }
body.social .s-box p { font-size: var(--fs-13); }
body.social .s-aviso { font-size: var(--fs-13); border-radius: 6px; }
body.social .s-post h1 { font-size: var(--fs-24); font-weight: 700; line-height: var(--lh-title); }
body.social .s-corpo { font-size: var(--fs-15); line-height: 1.6; color: var(--r-text); }
body.social .s-com-bal .s-corpo { font-size: var(--fs-14); }
body.social .s-comentarios h3 { font-size: var(--fs-16); font-weight: 700; }
body.social .s-ficha { font-size: var(--fs-13); border-radius: 6px; }
body.social .s-campo label { font-size: var(--fs-13); }
body.social .s-campo .dica { font-size: var(--fs-12); }
body.social .s-form-com textarea, body.social .s-campo textarea, body.social .s-campo input, body.social .s-campo select, body.social .s-filtro select, body.social .s-filtro input { font-size: 16px; border-radius: 6px; }
body.social .s-tipo-op { border-radius: 8px; }
body.social .s-tipo-op .t { font-size: var(--fs-14); }
body.social .s-tipo-op .d { font-size: var(--fs-12); }
body.social .s-abas a { font-size: var(--fs-13); min-height: 40px; display: inline-flex; align-items: center; }
body.social .s-notif b { font-size: var(--fs-14); }
body.social .s-notif span { font-size: var(--fs-12); }
body.social .s-grupo-capa { border-radius: 8px; }
body.social .s-grupo-capa h1 { font-size: var(--fs-20); font-weight: 700; }
body.social .s-breve h1 { font-size: 1.75rem; font-weight: 700; }
body.social .s-breve p { font-size: var(--fs-16); }
body.social .s-breve-login { font-size: var(--fs-14); }
body.social .s-demo { font-size: var(--fs-11); padding: 1px 6px; }
body.social .s-status { font-size: var(--fs-11); border-radius: 4px; }
body.social .modal-title { font-size: var(--fs-16); font-weight: 700; }
body.social .s-selo { color: var(--r-blue); font-size: var(--fs-14); }
@media (max-width: 760px) {
  body.social .s-btn, body.social .s-ic, body.social .s-abas a { min-height: 44px; }
  body.social .s-chip { min-height: 40px; }
}
/* a lista antiga dentro da casca nova usa o mesmo espaço entre cartões do protótipo */
body.r-app #sLista { display: flex; flex-direction: column; gap: 10px; }
body.r-app #sLista > .r-post { margin: 0; }
body.r-app .s-grid { gap: 24px; }
@media (min-width: 992px) { body.r-app .s-grid { grid-template-columns: minmax(0, 1fr) 300px; } body.r-app .s-lado { top: 76px; } }
/* casca do portal (visitante): os links dos cartões do protótipo sem o sublinhado padrão do portal */
body.social .r-card a, body.social .r-post a { text-decoration: none; }
body.social .r-card a:hover { text-decoration: underline; }
body.social .r-card a.r-cta:hover, body.social .r-card a.r-abtn:hover { text-decoration: none; }

/* ═══════════════════════════════════════════════════════════════════════
   FASES 2 E 3 — "Plano FREEL Social v2 (28/09/2026)" §10 (ondas), §11.1 (ciclo do pedido) e
   §16 (Painel do autor, IA de case). Mesmos tokens compactos da Fase 1 (Plano §6).
   ═══════════════════════════════════════════════════════════════════════ */
/* ondas no Painel do autor */
.r-onda { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.r-onda-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3px; max-width: 220px; }
.r-onda-bar i { height: 6px; border-radius: 3px; background: var(--r-line2); }
.r-onda-bar i.on { background: var(--r-teal); }
.r-onda-bar i.teste { background: linear-gradient(90deg, var(--r-teal) var(--p, 50%), var(--r-line2) var(--p, 50%)); }
.r-onda-bar.seg i.on { background: #A0400E; }
.r-onda b { font-size: var(--fs-13); color: var(--r-ink); font-weight: 600; }
.r-onda .q { font-size: var(--fs-12); color: var(--r-sub); line-height: var(--lh-meta); overflow-wrap: anywhere; }
.r-ondas-lista { display: flex; flex-direction: column; }
.r-onda-it { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 16px; padding: 12px 14px; border-top: 1px solid var(--r-line2); align-items: start; }
.r-onda-it:first-child { border-top: 0; }
.r-onda-it .tt { font-weight: 600; color: var(--r-ink) !important; font-size: var(--fs-14); }
.r-onda-it .mt { display: block; font-size: var(--fs-12); color: var(--r-muted); }
@media (max-width: 640px) { .r-onda-it { grid-template-columns: minmax(0, 1fr); gap: 6px; } }
.r-tag { display: inline-block; font-size: var(--fs-11); font-weight: 700; border-radius: 4px; padding: 1px 6px; background: var(--r-teal-soft); color: var(--r-teal); }
.r-tag.seg { background: #FDF0E7; color: #8A3A0C; }
.r-tag.cmp { background: var(--r-blue-soft); color: var(--r-navy); }
/* pedidos: lista */
.r-peds { gap: 0; }
.r-ped { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; border-top: 1px solid var(--r-line2); color: inherit !important; }
.r-peds > .r-ped:first-child { border-top: 0; }
.r-ped:hover { text-decoration: none !important; background: var(--r-soft); }
.r-ped .r-av { width: 44px; height: 44px; border-radius: 22px; font-size: var(--fs-14); }
.r-ped .c { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.r-ped .t { font-weight: 600; color: var(--r-ink); font-size: var(--fs-14); overflow-wrap: anywhere; }
.r-ped .s { font-size: var(--fs-12); color: var(--r-muted); overflow-wrap: anywhere; }
.r-ped .p { font-size: .78125rem; color: var(--r-sub); }
.r-ped .d { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex: none; max-width: 42%; text-align: right; }
.r-ped .d .v { font-size: var(--fs-12); color: var(--r-muted); }
.r-ped-val { color: var(--r-ink); font-size: var(--fs-13); }
.r-ped[data-vez] { box-shadow: inset 3px 0 0 var(--r-cta); padding-left: 10px; }
@media (max-width: 520px) { .r-ped { flex-wrap: wrap; } .r-ped .d { flex-direction: row; align-items: center; max-width: none; width: 100%; padding-left: 56px; justify-content: flex-start; text-align: left; } }
.r-vez { display: inline-block; background: var(--r-cta); color: #fff; font-size: var(--fs-11); font-weight: 700; border-radius: 9px; padding: 0 6px; line-height: 16px; }
.r-pst { display: inline-block; font-size: var(--fs-11); font-weight: 700; border-radius: 4px; padding: 2px 8px; background: var(--r-blue-soft); color: var(--r-navy); white-space: nowrap; }
.r-pst.ok { background: var(--r-teal-soft); color: var(--r-teal); }
.r-pst.mute { background: var(--r-soft); color: var(--r-muted); }
.r-menu-lado a.on { background: var(--r-soft); font-weight: 600; box-shadow: inset 3px 0 0 var(--r-navy); }
.r-passos { margin: 0 0 8px; padding-left: 18px; font-size: var(--fs-13); color: var(--r-text); line-height: 1.6; }
/* pedidos: detalhe */
.r-ped-det { display: flex; flex-direction: column; gap: 10px; }
.r-ped-top { display: flex; gap: 10px; align-items: flex-start; justify-content: space-between; }
.r-agora { font-size: var(--fs-13); background: var(--r-soft); border-radius: 6px; padding: 8px 10px; color: var(--r-text); }
.r-agora.vez { background: #FDF0E7; color: #5E2A0A; }
.r-ped-acoes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.r-ped-txt h2 { font-size: var(--fs-13); font-weight: 700; color: var(--r-muted); margin: 0 0 4px; text-transform: none; }
.r-ped-txt p { font-size: var(--fs-14); margin: 0 0 6px; color: var(--r-text); overflow-wrap: anywhere; }
.r-ped-prop b { color: var(--r-ink); font-size: var(--fs-15); }
.r-ped-av { display: flex; flex-direction: column; gap: 2px; border: 1px solid var(--r-line2); border-radius: 8px; padding: 10px 12px; font-size: var(--fs-14); }
.r-ped-av q { color: var(--r-text); }
.r-ped-av small { color: var(--r-muted); font-size: var(--fs-12); }
.r-estr { color: #B7791F; letter-spacing: 1px; font-size: var(--fs-16); }
.r-estr span { color: var(--r-line); }
/* linha do tempo (Plano §11.1) */
.r-tl { list-style: none; margin: 0; padding: 0; position: relative; }
.r-tl li { display: flex; gap: 10px; padding: 0 0 12px; position: relative; font-size: var(--fs-13); color: var(--r-text); }
.r-tl li::before { content: ''; position: absolute; left: 5px; top: 14px; bottom: 0; width: 2px; background: var(--r-line2); }
.r-tl li:last-child::before { display: none; }
.r-tl li:last-child { padding-bottom: 0; }
.r-tl .pt { width: 12px; height: 12px; border-radius: 6px; margin-top: 3px; flex: none; background: var(--r-teal); position: relative; z-index: 1; }
.r-tl li.falta .pt { background: var(--r-card); border: 2px solid var(--r-line); }
.r-tl li.falta { color: var(--r-muted); }
.r-tl b { font-weight: 600; color: inherit; }
.r-tl li.ok b { color: var(--r-ink); }
.r-tl .tx { color: var(--r-sub); }
.r-tl small { display: block; font-size: var(--fs-12); color: var(--r-muted); }
.r-b2b { padding: 12px 0; border-top: 1px solid var(--r-line2); display: flex; flex-direction: column; gap: 8px; }
.r-lista > .r-b2b:first-child { border-top: 0; }
.r-b2b .t { font-weight: 600; color: var(--r-ink) !important; font-size: var(--fs-14); }
.r-case { border-color: #9CCFC6; }
.r-case-t { font-weight: 600; font-size: var(--fs-15); color: var(--r-ink); margin: 0 0 2px; }
.r-case-prev { font-size: var(--fs-13); color: var(--r-text); margin: 0; overflow-wrap: anywhere; }
/* caixa lateral do post: "Do post ao contrato" e "Seu pedido" */
.r-funil { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 6px 0 8px; }
.r-funil div { background: var(--r-soft); border-radius: 6px; padding: 6px 8px; display: flex; flex-direction: column; }
.r-funil b { font-size: var(--fs-16); color: var(--r-ink); line-height: 1.2; }
.r-funil span { font-size: var(--fs-11); color: var(--r-muted); }

/* ═════════ Plano FREEL Social v2 (28/09/2026) §12 e §13 — distintivo "Responde rápido" e Preferências de avisos ═════════ */
.r-rr { display: inline-flex; align-items: center; gap: 3px; font-size: var(--fs-11); font-weight: 700; color: var(--r-blue); background: var(--r-blue-soft); border-radius: 4px; padding: 0 6px; line-height: 18px; white-space: nowrap; }
.r-bdg.rr { background: var(--r-blue-soft); color: var(--r-blue); font-weight: 700; }
.r-pref { width: 100%; border-collapse: collapse; }
.r-pref th { font-size: var(--fs-12); font-weight: 700; color: var(--r-muted); text-align: center; padding: 8px 4px; border-bottom: 1px solid var(--r-line2); white-space: nowrap; }
.r-pref th:first-child { text-align: left; padding-left: 16px; }
.r-pref td { padding: 10px 4px; border-bottom: 1px solid var(--r-line2); text-align: center; vertical-align: middle; width: 76px; }
.r-pref td:first-child { text-align: left; width: auto; padding-left: 16px; }
.r-pref td b { display: block; font-size: var(--fs-14); color: var(--r-ink); }
.r-pref td span { display: block; font-size: var(--fs-12); color: var(--r-muted); line-height: var(--lh-meta); }
.r-pref tr:last-child td { border-bottom: 0; }
.r-sw { position: relative; display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; cursor: pointer; margin: 0; }
.r-sw input { position: absolute; opacity: 0; width: 44px; height: 44px; margin: 0; cursor: pointer; }
.r-sw i { display: block; flex-shrink: 0; width: 36px; height: 20px; border-radius: 10px; background: #C5CDD8; position: relative; transition: background .15s; }
.r-sw i::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 8px; background: #FFFFFF; transition: left .15s; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.r-sw input:checked + i { background: var(--r-teal); }
.r-sw input:checked + i::after { left: 18px; }
.r-sw input:disabled + i { opacity: .55; }
.r-sw input:focus-visible + i { outline: 2px solid var(--r-cta); outline-offset: 2px; }
.r-pref-canal { display: flex; flex-wrap: wrap; gap: 6px 14px; padding: 10px 16px; font-size: var(--fs-12); color: var(--r-sub); border-top: 1px solid var(--r-line2); background: var(--r-soft); }
.r-pref-canal b { color: var(--r-ink); }
.r-pref-pe { display: flex; gap: 8px; justify-content: flex-end; align-items: center; flex-wrap: wrap; padding: 12px 16px; border-top: 1px solid var(--r-line2); }
@media (max-width: 480px) {
  .r-pref th:first-child, .r-pref td:first-child { padding-left: 12px; }
  .r-pref td { width: 48px; padding: 8px 0; }
  .r-pref th:not(:first-child) { width: 48px; white-space: normal; line-height: 1.2; }
  .r-pref th { font-size: var(--fs-11); padding: 8px 2px; }
}