/* Hallmark · interaction layer · editorial Workbench */
:focus-visible {
  outline:2px solid var(--color-focus);
  outline-offset:4px
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:clip;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0
}

.skip-link {
  position:fixed;
  left:16px;
  top:12px;
  z-index:100;
  padding:12px 16px;
  background:var(--color-ink);
  color:var(--color-paper);
  transform:translateY(-160%);
  min-height:44px;
  white-space:nowrap
}

.skip-link:focus {
  transform:none;
  color:var(--color-paper)
}

.command-menu {
  width:min(560px,calc(100% - 32px));
  max-height:85dvh;
  border:1px solid var(--color-rule-strong);
  background:var(--color-paper);
  color:var(--color-ink);
  padding:24px;
  border-radius:var(--radius-surface)
}

.command-menu::backdrop {
  background:var(--color-backdrop)
}

.command-menu-head {
  display:flex;
  justify-content:space-between;
  align-items:start;
  gap:16px;
  margin-bottom:20px
}

.command-menu-head h2 {
  font-size:2.5rem
}

.command-close {
  min-height:44px;
  min-width:44px;
  font-size:12px
}

.command-label {
  font-size:12px;
  display:block;
  margin-bottom:8px;
  color:var(--color-ink-muted)
}

.command-input {
  width:100%;
  font-size:16px
}

.command-status {
  font-size:12px;
  color:var(--color-ink-muted);
  margin-top:12px
}

.command-options {
  list-style:none;
  padding:0;
  margin:20px 0 0
}

.command-options a {
  min-height:60px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px;
  text-decoration:none;
  border-top:1px solid var(--color-rule)
}

.command-options a[data-active=true] {
  background:var(--color-paper-2);
  color:var(--color-accent)
}

.command-options b {
  font-size:14px;
  font-weight:500
}

.command-options small {
  display:block;
  font-size:12px;
  margin-top:4px
}

.command-options kbd {
  white-space:nowrap
}

.command-options a:active {
  background:var(--color-paper-3)
}

.run-button[aria-busy=true] {
  cursor:progress
}

.run-feedback[data-kind=error] {
  border-color:var(--status-invalidated);
  background:var(--status-invalidated-soft)
}

.run-feedback[data-kind=success] {
  border-color:var(--status-intact);
  background:var(--status-intact-soft)
}

@media(max-width:480px) {
  .command-menu {
    padding:20px
  }

  .command-menu-head h2 {
    font-size:2rem
  }

  .command-options kbd {
    display:none
  }

}