/* The institutional mark.
 *
 * Its own file because both shells render it and they load different
 * stylesheets: the application has app.css, the Django admin deliberately
 * does not. Keeping this here is what stops the mark from falling back to
 * its natural 714px in the admin header, which is exactly what happened when
 * the rules lived in app.css alone.
 *
 * Provenance of the two files: static/ui/img/README.md.
 */

/* The institutional mark, sized by whatever contains it. Two files rather
   than one recoloured: the mark is two-coloured and its dark half disappears
   on a dark surface, so dark mode gets the lime variant. Chosen in CSS for
   the same reason as the control above - right at first paint, right with
   scripting off. Provenance: static/ui/img/README.md. */
.ds-brand-mark {
  display: block;
  width: 100%;
  height: 100%;
}
.ds-brand-mark > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ds-brand-mark > [data-theme-mark-dark] {
  display: none;
}
[data-theme="dark"] .ds-brand-mark > [data-theme-mark-dark] {
  display: block;
}
[data-theme="dark"] .ds-brand-mark > [data-theme-mark-light] {
  display: none;
}
[data-theme="light"] .ds-brand-mark > [data-theme-mark-dark] {
  display: none;
}
[data-theme="light"] .ds-brand-mark > [data-theme-mark-light] {
  display: block;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ds-brand-mark > [data-theme-mark-dark] {
    display: block;
  }
  :root:not([data-theme="light"]) .ds-brand-mark > [data-theme-mark-light] {
    display: none;
  }
}