.opening-map-document-recall-controls {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  margin-block: 0;
  color: var(--map-text);
  font: 400 15px/1.5 var(--map-ui-font);
}

.opening-map-document-recall-controls[hidden],
.opening-map-document-recall-controls [hidden] { display: none; }

.opening-map-document-recall-progress,
.opening-map-document-recall-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 16px;
}

.opening-map-document-recall-progress { justify-content: space-between; }

.opening-map-document-recall-controls button {
  box-sizing: border-box;
  min-height: 36px;
  padding: 5px 8px;
  border: 1px solid var(--map-border);
  border-radius: 0;
  background: transparent;
  color: var(--map-text);
  font: inherit;
}

.opening-map-document-recall-controls button { cursor: pointer; }
.opening-map-document-recall-controls button:enabled:hover { background: var(--map-control-hover); }
.opening-map-document-recall-controls button:disabled { opacity: .6; }
.opening-map-document-recall-controls button:focus-visible,
.opening-map-document-recall-move:focus-visible,
.opening-map-document-recall-percent:focus-visible,
.opening-map-document-recall-accuracy:focus-visible {
  outline: var(--document-focus-outline, 2px solid var(--map-accent));
  outline-offset: 2px;
}

.opening-map-document-recall-actions { gap: 8px; }
.opening-map-document-recall-direct-restart { display: inline-flex; }
.opening-map-document-recall-options { position: relative; display: inline-flex; }
.opening-map-document-recall-controls .opening-map-document-recall-options-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  padding: 8px;
  border: 0;
  color: var(--map-muted);
}
.opening-map-document-recall-options-icon {
  display: block;
  width: 20px;
  height: 20px;
  filter: var(--map-icon-filter);
  pointer-events: none;
}
.opening-map-document-recall-options-button:enabled:hover .opening-map-document-recall-options-icon {
  filter: var(--map-icon-hover-filter);
}
.opening-map-document-recall-options-menu {
  position: absolute;
  z-index: 4;
  inset-inline-end: 0;
  bottom: calc(100% + 6px);
  min-width: 140px;
  padding: 4px;
  border: 1px solid var(--map-border);
  background: var(--map-panel-solid);
}
.opening-map-document-recall-options-menu .opening-map-document-recall-restart {
  width: 100%;
  border: 0;
  text-align: left;
  white-space: nowrap;
}
.opening-map-document-recall-percent { color: var(--map-muted); }
.opening-map-document-recall-accuracy { align-self: flex-start; color: var(--map-muted); }
.opening-map-document-recall-controls[data-summary="true"] .opening-map-document-recall-move { font-weight: 500; }
.opening-map-document-recall-scope { font-weight: 500; overflow-wrap: anywhere; }
.opening-map-document-recall-message,
.opening-map-document-recall-error { margin: 0; overflow-wrap: anywhere; }
.opening-map-document-recall-error { color: var(--map-bad); }
.opening-map-document-recall-retry { align-self: flex-start; }
.opening-map-repertoire-document:not([data-reading="true"]) .opening-map-document-recall-controls {
  display: none;
}
.opening-map-document-toolbar .opening-map-document-read-button {
  width: 36px;
  padding: 8px;
  font: 400 15px/1.5 var(--map-ui-font);
}
.opening-map-repertoire-document[data-reading="true"] .opening-map-document-sidebar-tabs,
.opening-map-repertoire-document[data-reading="true"] .opening-map-document-toolbar > :not(.opening-map-document-read-button):not(.opening-map-document-zoom),
.opening-map-repertoire-document[data-reading="true"] .opening-map-document-move-stats,
.opening-map-repertoire-document[data-reading="true"] .opening-map-document-insights,
.opening-map-repertoire-document[data-reading="true"] .opening-map-repertoire-document-sources {
  display: none;
}
.opening-map-document-recall-controls {
  padding: 16px 24px;
  box-sizing: border-box;
}
.opening-map-repertoire-document[data-reading="true"] .opening-map-repertoire-document-continuations-error {
  display: none;
}

@media (min-width: 821px) {
  .opening-map-document-recall-reveal {
    min-inline-size: 7em;
  }
  .opening-map-repertoire-document[data-reading="true"] .opening-map-document-sidebar-tabs,
  .opening-map-repertoire-document[data-reading="true"] .opening-map-document-toolbar > .opening-map-document-study-shortcut:not(.opening-map-document-read-button) {
    display: flex;
  }
  .opening-map-repertoire-document[data-reading="true"] .opening-map-document-toolbar > .opening-map-document-paper-actions:not(.opening-map-document-read-button) {
    display: contents;
  }
}
