/* Customizing the Grey primary color for a deeper Sumi ink feel */
:root [data-md-color-primary="grey"] {
    --md-primary-fg-color:        #313236; /* Darker header background */
    --md-primary-fg-color--light: #4a4a54; /* Hover states and secondary bars */
    --md-primary-fg-color--dark:  #1a1a1a; /* Even darker accents */
    /* This ensures the search bar and icons stay consistent */
    --md-primary-bg-color:        #ffffff;
  }

/* Mobile view: Nuke the video element and its ghost space */
@media (max-width: 768px) {
  .desktop-only, 
  .desktop-only video {
    display: none !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute; /* Takes it out of the normal layout flow */
    pointer-events: none;
  }
  .mobile-only {
    display: block;
  }
}

/* Desktop view: Normal state */
@media (min-width: 769px) {
  .mobile-only {
    display: none !important;
  }
  .desktop-only {
    display: block;
  }
}