/* Shared components: overlays (dialog, drawer, sheet), capture bar, tooltip, shortcuts sheet. */
.overlay { border: 1px solid var(--hairline); border-radius: 12px; padding: 0; background: var(--paper); color: var(--ink); box-shadow: var(--shadow-pop); width: min(520px, calc(100vw - 32px)); max-height: calc(100vh - 48px); display: flex; flex-direction: column; }
.overlay:not([open]) { display: none; }
.overlay::backdrop { background: #0b122099; }
.overlay--wide { width: min(880px, calc(100vw - 32px)); }
.overlay__header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--hairline); }
.overlay__title { font: 650 18px/1.2 var(--font-display); letter-spacing: -.02em; }
.overlay__body { padding: 16px; overflow: auto; display: flex; flex-direction: column; gap: 12px; }
.overlay__footer { display: flex; justify-content: flex-end; gap: 10px; padding: 12px 16px; border-top: 1px solid var(--hairline); }
.overlay__footer:empty { display: none; }
.overlay__close svg { width: 18px; height: 18px; }
.overlay__grab { display: none; width: 40px; height: 4px; border-radius: 2px; background: var(--line-strong); align-self: center; margin-top: 8px; }
.overlay--drawer { margin: 0 0 0 auto; height: 100vh; max-height: 100vh; border-radius: 0; border-width: 0 0 0 1px; width: min(440px, 100vw); }
.overlay--drawer.overlay--wide { width: min(640px, 100vw); }

@media (max-width: 759.98px) {
  .overlay, .overlay--drawer { margin: auto 0 0; width: 100vw; max-width: 100vw; max-height: 92vh; height: auto; border-radius: 16px 16px 0 0; border-width: 1px 0 0; padding-bottom: env(safe-area-inset-bottom); }
  .overlay__grab { display: block; }
}

/* Capture bar: Bookmark · Record · Flag frame, same order and keys on every player */
.capture-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 10px 12px; padding-inline-end: max(12px, var(--launcher-clear)); background: var(--card); border: 1px solid var(--hairline); border-radius: var(--radius-card); }
.capture-bar__reason { font-size: var(--text-xs); }
.capture-bar__safety { font-size: var(--text-xs); }
.capture-bar__duration { min-height: 38px; }
.capture-bar--compact { padding: 8px; border-radius: 8px; }
@media (max-width: 759.98px) {
  .capture-bar { padding-inline-end: 12px; }
  .capture-bar .btn { flex: 1; min-height: 48px; }
  .capture-bar .kbd { display: none; }
}

/* Tooltip */
.tooltip { position: fixed; z-index: 70; max-width: 280px; padding: 6px 9px; border-radius: 6px; background: var(--navy); color: var(--on-navy); font-size: var(--text-xs); line-height: 1.4; pointer-events: auto; box-shadow: var(--shadow-pop); }

/* Shortcuts sheet and sign-in */
.shortcut-list { display: grid; grid-template-columns: max-content 1fr; gap: 8px 14px; margin: 0; }
.shortcut-list dd { margin: 0; }
.signin { display: flex; flex-direction: column; gap: 12px; }
.signin .input { width: 100%; }
.signin__actions { display: flex; justify-content: flex-end; }
.signin__note { font-size: var(--text-xs); }
.signin--named .btn-block { width: 100%; justify-content: center; min-height: 44px; text-decoration: none; }
.signin__more { border-top: 1px solid var(--hairline); padding-top: 10px; }
.signin__more summary { cursor: pointer; color: var(--link); font-size: var(--text-small); }
.signin__more .signin { margin-top: 10px; }