/* Shared Add-media picker host (Post + Event). Reuses E1g visual classes; works outside .su. */
.mpk-root { position: fixed; inset: 0; z-index: 80; pointer-events: none; }
.mpk-root .ev-scrim, .mpk-root .ev-sheet { pointer-events: auto; }
.mpk-root .ev-scrim { position: absolute; inset: 0; background: var(--scrim, rgba(0,0,0,.48)); z-index: 1; animation: evfade .2s linear; }
.mpk-root .ev-sheet {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  background: var(--sheet-bg, var(--surface, #151a17));
  border-radius: var(--radius-sheet, 20px) var(--radius-sheet, 20px) 0 0;
  padding: 8px 16px max(28px, env(safe-area-inset-bottom, 0px));
  box-shadow: var(--sh-3, 0 -8px 28px rgba(0,0,0,.28));
  max-height: 92%; overflow-y: auto; animation: evup .26s var(--ease, cubic-bezier(.2,.8,.2,1));
  color: var(--ink, var(--u-ink, #E8EEEA));
}
.mpk-root .ev-sheet .ev-grab { width: 36px; height: 5px; border-radius: 3px; background: var(--line-strong, color-mix(in srgb, var(--ink,#fff) 22%, transparent)); margin: 0 auto 10px; }
.mpk-root .ev-sheet.out { transform: translateY(105%); transition: transform .2s var(--ease, cubic-bezier(.2,.8,.2,1)); }
.mpk-root .ev-scrim.out { opacity: 0; transition: opacity .2s linear; }

.mpk-root .ev-sheet.e1-libsheet {
  max-height: min(78vh, 640px);
  padding-bottom: max(10px, env(safe-area-inset-bottom, 0px));
  display: flex; flex-direction: column; overflow: hidden;
}
.mpk-root .ev-sheet.e1-libsheet .e1g-lib { display: flex; flex-direction: column; min-height: 0; flex: 1; }

/* Ensure e1g styles apply even if events.css `.su .ev-sheet.e1-libsheet` is the only libsheet rule */
.mpk-root .e1g-mpop .e1-optrow.e1g-live { display: flex; flex-direction: row; gap: 8px; }

/* HP1: Add tiles are <label>s with their own file input stretched over them (tap hits the input = OS picker on first tap) */
label.mpk-lbl { position: relative; cursor: pointer; -webkit-tap-highlight-color: transparent; -webkit-user-select: none; user-select: none; box-sizing: border-box; overflow: hidden; }
label.mpk-lbl > input.mpk-in { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer; font-size: 16px; z-index: 5; -webkit-appearance: none; appearance: none; color: transparent; background: transparent; }
label.mpk-lbl[hidden] { display: none !important; }
label.mpk-lbl:has(> input.mpk-in:focus-visible) { outline: 2px solid #D93350; outline-offset: 2px; }
