/* ══ FREEBOARD: marchio ════════════════════════════════════════════════════════════════════════════
   Il mondo visivo «Delta» (token, superfici, caratteri, il flusso del mese) è comune a Bilancio e sta in
   fondo a styles.css. Qui solo il marchio di Freeboard: la prua sopra la linea d'acqua (navy #0b1533,
   porcellana #f4f0e6, menta #62e6b0) al posto del pallino e il nome in Overpass, la lettera del logo. */
:root {
  --brand-navy: #0b1533; --brand-cream: #f4f0e6; --brand-mint: #62e6b0; --brand-mint-ink: #0a7f63;
  --font-mark: "Overpass", "Archivo", system-ui, sans-serif;
}

/* Il simbolo al posto del pallino, il nome nella lettera del logo */
.brand-dot { width: 24px; height: 24px; border-radius: 22%; background: url(icons/freeboard-mark-128.png) center / contain no-repeat; }
.brand, .topbar-brand { font-family: var(--font-mark); font-weight: 740; font-stretch: 100%; font-size: 19px; letter-spacing: -0.01em; }
.shell.rail .brand-dot { width: 28px; height: 28px; }

/* Marchio anche nell'app sul telefono: simbolo in alto a sinistra (il nome resta nella barra laterale
   e nel login); dove la barra ha il cambio mese, il simbolo lascia il posto */
@media (max-width: 560px) {
  .topbar-brand { display: inline-flex; font-size: 0; gap: 0; }
  .topbar-brand .brand-dot { width: 28px; height: 28px; }
  .topbar:has(#month-switch:not([hidden])) .topbar-brand { display: none; }
}