/* The page supplies width and placement. Canvas and fallback share one box. */
[data-main-chrome-mark] {
  position: relative;
  display: block;
  width: min(100%, 24rem);
  aspect-ratio: 1;
  isolation: isolate;
}

[data-main-chrome-mark] > .chrome-mark-canvas,
[data-main-chrome-mark] > .main-chrome-mark-fallback {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}

[data-main-chrome-mark] > .chrome-mark-canvas {
  z-index: 1;
}

[data-main-chrome-mark] > .main-chrome-mark-fallback {
  visibility: visible;
  filter: brightness(1.6) saturate(0.65);
}

body.dark [data-main-chrome-mark] > .main-chrome-mark-fallback {
  filter: none;
}

[data-main-chrome-mark].has-webgl > .main-chrome-mark-fallback {
  visibility: hidden;
}
