.shell-quick-actions {
  bottom: calc(var(--space-4) + env(safe-area-inset-bottom, 0px));
  left: calc(var(--shell-sidebar-width) + var(--space-4));
  max-width: calc(100vw - var(--shell-sidebar-width) - (2 * var(--space-4)));
  position: fixed;
  transition: left .16s ease, opacity .16s ease;
  z-index: 900;
}

.shell-quick-actions-disclosure {
  position: relative;
  width: fit-content;
}

.shell-quick-actions-launcher {
  align-items: center;
  background: var(--panel);
  border: 1px solid var(--brand);
  border-radius: 999px;
  box-shadow: var(--shadow-raised);
  color: var(--brand-dark);
  cursor: pointer;
  display: inline-flex;
  font-weight: 800;
  gap: var(--space-2);
  list-style: none;
  min-height: var(--density-control-height);
  padding: var(--density-control-padding);
  white-space: nowrap;
}

.shell-quick-actions-launcher::-webkit-details-marker {
  display: none;
}

.shell-quick-actions-launcher:hover,
.shell-quick-actions-disclosure[open] > .shell-quick-actions-launcher {
  background: var(--brand-soft);
}

.shell-quick-actions-launcher:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}

.shell-quick-actions-menu {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  bottom: calc(100% + var(--space-2));
  box-shadow: var(--shadow-raised);
  display: grid;
  gap: var(--space-2);
  left: 0;
  max-height: min(60vh, 24rem);
  max-width: calc(100vw - var(--shell-sidebar-width) - (2 * var(--space-4)));
  min-width: min(20rem, calc(100vw - var(--shell-sidebar-width) - (2 * var(--space-4))));
  overflow-x: hidden;
  overflow-y: auto;
  padding: var(--space-2);
  position: absolute;
  width: max-content;
}

.shell-quick-actions-disclosure:not([open]) > .shell-quick-actions-menu {
  display: none;
}

.shell-quick-actions-menu .button {
  justify-content: flex-start;
  max-width: 100%;
  white-space: normal;
  width: 100%;
}

.compact-density .shell-quick-actions-menu {
  gap: var(--space-1);
  padding: var(--space-1);
}

.js .layout:has([data-nav-toggle][aria-expanded="true"]) .shell-quick-actions {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

@media (max-width: 900px) {
  .shell-quick-actions {
    bottom: calc(var(--space-3) + env(safe-area-inset-bottom, 0px));
    left: var(--space-3);
    max-width: calc(100vw - (2 * var(--space-3)));
  }

  .shell-quick-actions-menu {
    max-width: calc(100vw - (2 * var(--space-3)));
    min-width: min(20rem, calc(100vw - (2 * var(--space-3))));
  }

  html:not(.js) .shell-quick-actions {
    align-self: start;
    margin: var(--space-3);
    position: static;
  }
}

@media (max-width: 480px) {
  .shell-quick-actions {
    left: auto;
    right: var(--space-3);
  }

  .shell-quick-actions-launcher > span {
    display: none;
  }

  .shell-quick-actions-menu {
    left: auto;
    right: 0;
  }
}

@media (max-height: 560px) {
  .shell-quick-actions-menu {
    max-height: calc(100dvh - 5rem);
  }
}

@media (forced-colors: active) {
  .shell-quick-actions-launcher,
  .shell-quick-actions-menu {
    background: Canvas;
    border-color: ButtonText;
    color: ButtonText;
  }

  .shell-quick-actions-disclosure[open] > .shell-quick-actions-launcher {
    outline: 2px solid Highlight;
  }
}