.contextual-task-bar {
 position: absolute;
 z-index: 1;
 inset-inline: 0;
 bottom: 15px;
 width: fit-content;
 max-width: calc(100% - 20px);
 margin-inline: auto;
 display: flex;
 align-items: center;
 gap: 6px;
 padding: 5px 6px;
 border: 1px solid #646464;
 border-radius: 7px;
 background: #373737;
 color: #eee;
 box-shadow: 0 4px 16px #0007;
}

.contextual-task-bar[hidden] { display: none; }
.app[inert] .contextual-task-bar { visibility: hidden; }
.contextual-task-label {
 padding: 0 6px 0 3px;
 font-size: 11px;
 color: #bdbdbd;
 white-space: nowrap;
 border-right: 1px solid #606060;
}

.contextual-task-actions {
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
 gap: 4px;
}

.contextual-task-bar button {
 min-height: 27px;
 padding: 4px 8px;
 border: 1px solid #656565;
 border-radius: 4px;
 background: #3f3f3f;
 color: inherit;
 font: 11px/1.25 Arial, sans-serif;
 white-space: nowrap;
}

.contextual-task-bar button:hover { background: #525252; }
.contextual-task-bar button:focus-visible {
 outline: 2px solid #a7cef3;
 outline-offset: 1px;
}
.contextual-task-bar .contextual-task-close {
 flex: none;
 border-color: transparent;
 background: transparent;
 padding-inline: 6px;
 font-size: 15px;
}

@media (max-width: 650px) {
 .contextual-task-bar { bottom: 8px; max-width: calc(100% - 12px); }
 .contextual-task-label { display: none; }
 .contextual-task-bar button { min-height: 32px; }
}
