* { box-sizing: border-box; }
body { margin: 0; font: 18px/1.4 -apple-system, system-ui, sans-serif; color: #1c2b27; background: #f4f7f6; }
main { max-width: 640px; margin: 0 auto; padding: 12px 12px 48px; }
h1 { font-size: 22px; margin: 8px 0 12px; }
.faixa { width: 100%; display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding: 14px 16px;
  font-size: 19px; font-weight: 600; color: #fff; background: #1F6F5C; border: 0; border-radius: 12px; }
.faixa.vazia { background: #8aa39b; }
.cards { padding: 4px 0; }
.card { background: #fff; border-radius: 12px; padding: 14px; margin-top: 8px; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.card a { font-weight: 600; color: inherit; text-decoration: none; font-size: 20px; }
.card .msg { color: #55645f; margin: 4px 0; overflow-wrap: anywhere; }
.card .meta { color: #7b8a85; font-size: 15px; }
.flag { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 15px; font-weight: 600; color: #fff; background: #d98a00; }
.flag.sem-resposta { background: #c0392b; }
.acoes { display: flex; gap: 10px; margin-top: 10px; }
.acoes button, .acoes select { flex: 1; min-height: 48px; font-size: 18px; border-radius: 10px; border: 1px solid #1F6F5C; background: #fff; color: #1F6F5C; }
.acoes button { background: #1F6F5C; color: #fff; font-weight: 600; }
.pin { text-align: center; padding-top: 20vh; }
.pin input { width: 11em; padding: 14px; font-size: 28px; text-align: center; letter-spacing: .3em; border-radius: 10px; border: 2px solid #1F6F5C; }
.pin .erro, .erro { color: #c0392b; margin: 10px 0; }
