/* VeryTally demo — shared bits (each page keeps its own layout CSS). */
.swatch { border-radius: 10px; display: flex; align-items: center; justify-content: center;
  font-weight: 900; font-size: 13px; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.5); flex-shrink: 0; }
.badge.flag { background: #3b1111; color: #fca5a5; font-size: 11px; font-weight: 800;
  padding: 3px 10px; border-radius: 99px; white-space: nowrap; }
.err { background: #3b1111; color: #fca5a5; border: 1px solid #7f1d1d; padding: 12px;
  border-radius: 10px; margin-top: 14px; font-size: 14px; }
.btn.ghost.sm { width: auto; padding: 8px 14px; font-size: 12.5px; margin: 0; }
.officer { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.officer .av { width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, #7c3aed, #2563eb); display: flex;
  align-items: center; justify-content: center; font-weight: 800; font-size: 14px; }
.officer .nm { font-size: 13px; font-weight: 700; }
.officer .rl { font-size: 11px; color: #8b98b8; }
.srcnote { color: #8b98b8; font-size: 12.5px; }
.srcnote b { color: #7aa5ff; }
.pu-code-big { font-size: 30px; font-weight: 900; letter-spacing: 1px; color: #7aa5ff;
  background: #0a0e1a; border: 2px solid #2f7df6; border-radius: 12px;
  padding: 12px 18px; display: inline-block; margin: 10px 0; }
@media (max-width: 640px) { .officer .txt { display: none; } }
.brand { height: 42px; border-radius: 10px; flex-shrink: 0; }