/* kit/uninstall/uninstall.css
   The "Uninstall <name>? Are you sure?" box and the Take back toast stack. No look of its own (a-look-of-its-own.md):
   colours, corners and fonts come from the product's tokens (--solid, --text, --line, --muted, --radius, --look-accent,
   --on-accent) with plain fallbacks. Buttons are at least 44 px. Needs kit/take-back/take-back.css beside it. */
.un-backdrop { position: fixed; inset: 0; z-index: 9050; display: grid; place-items: center; padding: 16px;
  background: rgba(3, 5, 10, .6); }
.un-dialog { box-sizing: border-box; width: min(380px, 100%); max-height: 100%; overflow: auto; padding: 18px 18px 14px;
  border-radius: var(--radius, 14px); border: 1px solid var(--line, rgba(127, 127, 127, .35));
  background: var(--solid, #1b2333); color: var(--text, #fff); box-shadow: var(--shadow, 0 20px 60px rgba(0, 0, 0, .55)); }
.un-head { display: flex; align-items: center; gap: 10px; }
.un-icon { font-size: 1.8em; line-height: 1; flex: none; }
.un-title { margin: 0; font: inherit; font-weight: 700; font-size: 1.15em; overflow-wrap: anywhere; }
.un-line { margin: 10px 0 14px; color: var(--muted, inherit); opacity: .95; }
.un-row { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; }
.un-btn { min-height: 44px; min-width: 96px; padding: 10px 18px; border-radius: var(--radius, 10px); font: inherit; cursor: pointer;
  border: 1px solid var(--line, currentColor); background: transparent; color: inherit; }
.un-cancel { background: var(--look-accent, #6ea8ff); color: var(--on-accent, #07101f); border-color: transparent; font-weight: 600; }
.un-btn:focus-visible { outline: 3px solid var(--look-accent, currentColor); outline-offset: 2px; }
.un-cancel:focus-visible { outline-color: var(--text, #fff); }

/* the Take back toasts: one slot each, stacked above the bottom bar so none takes another's place */
.un-stack { position: fixed; left: 50%; bottom: calc(var(--dock-h, 0px) + 16px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%); z-index: 9040; display: flex; flex-direction: column; align-items: center; gap: 8px;
  max-width: min(480px, calc(100vw - 32px)); pointer-events: none; }
.un-slot { pointer-events: auto; }
.un-stack .tb-toast { position: relative; left: auto; bottom: auto; transform: none; }
@media (prefers-reduced-motion: reduce) { .un-backdrop, .un-dialog { transition: none; } }