/* Mobile profile sheet: a native X scroller inside a transform-only Y shell. */
/* Programmatic return stays quiet; the next keypress restores keyboard cues. */
html[data-theme] body :is(button[data-wrestler-id], button[data-venue-card], button[data-mask-card], button[data-voice-card], article.vault-card[data-vault-preview-match]).is-drawer-return-focus:focus {
  --card-focus-ring: 0 0 0 0 transparent;
  outline: none !important;
  transform: none !important;
}
@media (max-width: 768px) {
  /* Horizontal clipping must not turn these document-scrolling pages' body
     into a scroll container that carries the sticky navigation offscreen. */
  html[data-theme] body:has(> main:is(.venues-page, .masks-page)) {
    overflow-x: clip !important;
    overflow-y: visible !important;
  }
  /* Lock the viewport without making body a new sticky-header scroll owner. */
  html[data-theme].profile-sheet-open body.detail-modal-open {
    overflow: clip !important;
  }
  /* Legacy fullscreen modals hide the header. The sheet covers it instead. */
  html[data-theme].profile-sheet-open body.detail-modal-open .site-header {
    opacity: 1 !important;
    visibility: visible !important;
  }
  html[data-theme].profile-sheet-open body.detail-modal-open :is(.wrestlers-shell, .venues-shell) {
    z-index: 0 !important;
  }
  html[data-theme].profile-sheet-open.detail-modal-open,
  html[data-theme].profile-sheet-open.detail-modal-open body.detail-modal-open {
    touch-action: pan-x pan-y pinch-zoom !important;
  }
  html[data-theme].profile-sheet-open body.detail-modal-open .profile-sheet .profile-sheet__panel .profile-sheet__view,
  html[data-theme].profile-sheet-open body.detail-modal-open .profile-sheet .profile-sheet__panel .profile-sheet__view :is(.timeline-detail__content, .timeline-detail__body, .timeline-detail__photo, .timeline-detail__copy, .timeline-detail__facts) {
    touch-action: pan-x pan-y pinch-zoom !important;
  }
  .profile-sheet-overlay {
    position: fixed; inset: 0; z-index: 13000;
    background: transparent; isolation: isolate;
  }
  .profile-sheet-overlay::before {
    content: ""; position: absolute; inset: 0;
    background: rgb(0 0 0 / 62%); opacity: 0;
    transition: opacity 260ms ease;
  }
  .profile-sheet-overlay.is-visible::before { opacity: 1; }
  html[data-theme] body .profile-sheet {
    --sheet-paper: #f4f1e9; --sheet-ink: #141413; --sheet-surface: #222222;
    --sheet-card-gutter: var(--archive-drawer-gutter, 15px); --sheet-card-gap: 12px;
    --sheet-content-padding: 20px;
    --sheet-top-gap: var(--archive-drawer-top-gap, max(10px, env(safe-area-inset-top, 0px)));
    position: absolute; inset: var(--sheet-top-gap) 0 auto;
    height: calc(100vh - var(--sheet-top-gap)); height: calc(100dvh - var(--sheet-top-gap)); width: 100vw;
    display: flex; flex-direction: column;
    padding: 0; overflow: hidden; border: 0;
    border-radius: 0;
    background: transparent; color: var(--sheet-paper);
    box-sizing: border-box; will-change: transform;
    transform: translateY(100%);
    transition: transform var(--archive-drawer-duration, 260ms) var(--archive-drawer-easing, cubic-bezier(.2,.75,.25,1));
  }
  html body .profile-sheet.is-dragging { transition: none; }
  html body .profile-sheet:focus { outline: none; }
  /* Every snap item owns its handle and vertical scroller. */
  .profile-sheet__panel::before {
    content: ""; position: absolute; inset: 0 0 auto; height: 48px;
    height: calc(48px + env(safe-area-inset-top, 0px));
    z-index: 4; background: var(--sheet-surface); pointer-events: none;
    opacity: 0; transition: opacity 180ms ease-in-out; will-change: opacity;
  }
  .profile-sheet__panel.is-reading::before { opacity: 1; }
  .profile-sheet__carousel {
    display: flex; flex: 1 1 auto; min-height: 0;
    gap: 0; padding-inline: var(--sheet-card-gutter);
    box-sizing: border-box;
    overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x mandatory; scroll-behavior: auto;
    overscroll-behavior: contain; scrollbar-width: none;
    overflow-anchor: none;
  }
  .profile-sheet__carousel::-webkit-scrollbar { display: none; }
  .profile-sheet__spacer { flex: 0 0 0px; height: 1px; pointer-events: none; }
  .profile-sheet__panel {
    position: relative; display: flex; flex-direction: column;
    flex: 0 0 calc(100vw - 2 * var(--sheet-card-gutter));
    width: calc(100vw - 2 * var(--sheet-card-gutter)); min-width: 0;
    margin-right: var(--sheet-card-gap);
    border-radius: 24px 24px 0 0;
    transform-origin: left top;
    scroll-snap-align: center; scroll-snap-stop: always;
    overflow: hidden; overscroll-behavior-x: auto; overscroll-behavior-y: none;
    touch-action: pan-x pan-y pinch-zoom;
    scrollbar-width: none; -ms-overflow-style: none; overflow-anchor: none;
    background: var(--sheet-surface); color: var(--sheet-paper);
    transition: opacity 220ms ease;
  }
  .profile-sheet.is-dragging .profile-sheet__panel { transition: none; }
  .profile-sheet__panel.is-last-card { margin-right: 0; }
  .profile-sheet__panel::-webkit-scrollbar { display: none; }
  .profile-sheet__scroll {
    position: relative; z-index: 0;
    flex: 1 1 auto; min-height: 0; overflow: hidden auto;
    padding-bottom: env(safe-area-inset-bottom, 0px); box-sizing: border-box;
    overscroll-behavior-x: auto; overscroll-behavior-y: none; touch-action: pan-x pan-y pinch-zoom;
    scrollbar-width: none; -ms-overflow-style: none; overflow-anchor: none;
  }
  .profile-sheet__scroll::-webkit-scrollbar { display: none; }
  html[data-theme] body .profile-sheet .profile-sheet__view {
    display: block !important; position: relative !important; inset: auto !important;
    width: 100% !important; max-width: none !important; min-width: 0 !important;
    height: auto !important; max-height: none !important; min-height: 0 !important;
    padding: 0 !important; margin: 0 !important; border: 0 !important;
    border-radius: 24px !important; overflow: visible !important;
    transform: none !important; opacity: 1 !important; visibility: visible !important;
    box-shadow: none !important; background: var(--sheet-surface); color: var(--sheet-paper);
    content-visibility: visible; contain: none;
  }
  html[data-theme] body.detail-modal-open .profile-sheet .profile-sheet__panel .profile-sheet__view :is(.wrestler-detail-panel__portrait, .venue-detail__hero) {
    position: relative; width: 100%; height: auto; min-height: 0;
    aspect-ratio: 4 / 5; max-height: none; margin: 0; padding: 0;
    border: 0; border-radius: 24px !important; overflow: hidden;
  }
  html[data-theme] body .profile-sheet .wrestler-detail-panel__portrait img {
    width: 100%; height: 100%; object-fit: cover;
  }
  html[data-theme] body .profile-sheet .wrestler-detail-panel__summary { padding: 18px var(--sheet-content-padding) 12px; border-bottom: 0; }
  html[data-theme] body .profile-sheet :is(.wrestler-detail-panel__summary, .venue-detail__header) { border-top: 0; }
  html[data-theme] body .profile-sheet .wrestler-detail-panel__tabs {
    position: static; top: auto; z-index: auto; margin: 0 var(--sheet-content-padding); padding: 12px 0;
    width: calc(100% - 2 * var(--sheet-content-padding)); box-sizing: border-box;
    background: var(--sheet-surface); border: 0;
  }
  html[data-theme] body .profile-sheet .wrestler-detail-panel__tab-panel > .wrestler-detail-panel__section:first-child { border-top: 0; }
  html[data-theme] body .profile-sheet .wrestler-detail-panel__section { padding: 18px var(--sheet-content-padding); }
  html[data-theme] body .profile-sheet .venue-detail__content { padding: 0; border: 0; border-radius: 0; }
  html[data-theme] body .profile-sheet :is(.wrestler-detail-panel__summary, .wrestler-detail-panel__facts, .wrestler-detail-panel__section, .wrestler-detail-panel__tab-panel, .venue-detail__content, .venue-detail__header, .venue-detail__stats, .venue-detail__section) {
    background: var(--sheet-surface); background-image: none; box-shadow: none;
  }
  html[data-theme] body .profile-sheet :is(.wrestler-detail-panel__name, .venue-detail__title) { color: var(--sheet-paper) !important; }
  html[data-theme] body .profile-sheet :is(.venue-detail__header, .venue-detail__stats, .venue-detail__section) { margin: 0; padding: 18px var(--sheet-content-padding); }
  /* Timeline keeps its existing mobile image dimensions, focus and sequences. */
  html[data-theme] body .profile-sheet .timeline-detail__content {
    display: block; height: auto !important; min-height: 0 !important;
    overflow: visible !important; padding: 0 !important; border: 0 !important;
    background: var(--sheet-surface) !important;
  }
  html[data-theme] body.detail-modal-open .profile-sheet .profile-sheet__panel .profile-sheet__view .timeline-detail__photo {
    width: 100% !important; margin: 0 !important; padding: 0 !important;
    border: 0 !important; border-radius: 24px !important;
  }
  html[data-theme] body .profile-sheet .timeline-detail__body {
    background: var(--sheet-surface) !important; color: var(--sheet-paper);
    padding: 20px var(--sheet-content-padding) calc(24px + env(safe-area-inset-bottom, 0px)) !important;
  }
  html[data-theme] body .profile-sheet .mask-detail-expand:not([hidden]) {
    display: inline-flex !important; width: 44px; height: 44px;
    top: auto !important; left: 12px !important; right: auto !important; bottom: 12px !important; z-index: 3;
  }
  html body .profile-sheet button:focus-visible { outline: 2px solid #f4f1e9; outline-offset: -4px; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme] body .profile-sheet, .profile-sheet-overlay::before { transition: none; }
  .profile-sheet__panel::before { transition: opacity 120ms linear; }
}
