/* os-mia.css — de BBYW-ingang als axolotl (09-10, team mascotte-os, lid A). Alleen actief met html.mia-merk (os-mia.js);
   noodrem localStorage mia-avatar=uit → de klasse ontbreekt en alles blijft zoals het was. */
html.mia-merk .mia-merk-weg { display: none !important; }
html.mia-merk .mia-merk-av { flex: none; }
/* computer: merk linksboven */
html.mia-merk .topbar .merk.mia-merk-host { padding-left: 2px; }
html.mia-merk .topbar .merk .mia-merk-home { margin: -3px 0; }
/* telefoon-tabbalk en rail: BBYW zelf is het icoon van Gesprekken; aan = een fijne ring in de OS-kleur */
html.mia-merk .op-ic.mia-merk-host { width: 24px; height: 24px; }   /* zelfde vak als de andere iconen: labels blijven op één lijn */
html.mia-merk .op-ic.mia-merk-host > .mia-merk-tab { margin: -2px; }
html.mia-merk .op-ic.mia-merk-host .mia-merk-tab { border-radius: 50%; transition: outline-color .18s ease, opacity .18s ease; }
html.mia-merk [data-plek="gesprekken"].on .mia-merk-tab { outline: 1.5px solid var(--teal, #0E6E73); outline-offset: 2px; }
/* niet actief: rustiger, zoals de grijze iconen ernaast (stil beeld, dus filter kost niets) */
html.mia-merk [data-plek="gesprekken"]:not(.on) .mia-merk-tab { filter: saturate(.55); opacity: .78; }
/* donker: de rand van het rondje valt weg op zwart onder ±36 px → een haarlijntje licht */
html.mia-merk[data-thema="avond"] .mia-merk-av { border-radius: 50%; box-shadow: 0 0 0 1px rgba(255,255,255,.16); }
/* zijbalk nav2: het blauwe vlak met de M wordt BBYW in haar water */
html.mia-merk .n2-zb-logo.mia-merk-host { background: none !important; width: auto !important; height: auto !important; border-radius: 50%; }
/* klassieke chatknop en DM-paneel */
html.mia-merk .chatknop.mia-merk-host { background: none; box-shadow: none; padding: 0; }
html.mia-merk .dm-logo.mia-merk-host { background: none; width: auto; height: auto; }
/* DM laden / niet bereikbaar */
html.mia-merk .dm-plek-laden { flex-direction: column; gap: 12px; }
html.mia-merk #dm-fout .mia-merk-fout { display: block; margin: 0 auto 10px; }
@media (prefers-reduced-motion: reduce) { html.mia-merk .op-ic.mia-merk-host .mia-merk-tab { transition: none; } }