/* PR #10 shell slot integration only. Do NOT load the original demo style.css
   into the shell; it styles :root, body, .phone and other global elements. */
.pc-demo [data-pc-slot="navigation"] .pc-nav-gesture-tabs {
  position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch; min-height: 72px; padding: 7px;
  border-radius: 27px; border: 1px solid rgba(255, 229, 255, .23);
  background: var(--pc-glass, rgba(37, 25, 45, .92));
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  backdrop-filter: blur(24px) saturate(145%);
  box-shadow: 0 14px 38px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.12);
  touch-action: pan-y; user-select: none; -webkit-user-select: none;
  -webkit-touch-callout: none;
}
.pc-demo [data-pc-slot="navigation"] .pc-nav-gesture-tab {
  position: relative; z-index: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 3px;
  min-height: 54px; min-width: 0; padding: 4px 0;
  border: 0; border-radius: 20px; background: transparent;
  color: #d7c0e1; font: inherit; cursor: pointer; touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}
.pc-demo [data-pc-slot="navigation"] .pc-nav-gesture-tab[aria-selected="true"],
.pc-demo [data-pc-slot="navigation"] .pc-nav-gesture-tab[data-preview="true"] { color: #fffaff; }
.pc-demo [data-pc-slot="navigation"] .pc-nav-gesture-icon { font-size: 22px; line-height: 25px; height: 25px; }
.pc-demo [data-pc-slot="navigation"] .pc-nav-gesture-label { font-size: 10px; font-weight: 700; white-space: nowrap; }
.pc-demo [data-pc-slot="navigation"] .pc-nav-gesture-tab:focus-visible { outline: 2px solid var(--pc-ring, #ffe2f0); outline-offset: -3px; }
.pc-demo [data-pc-slot="navigation"] .pc-nav-gesture-indicator {
  position: absolute; top: 7px; bottom: 7px; left: 0;
  border-radius: 20px; pointer-events: none; will-change: transform;
  background: linear-gradient(150deg,#aa508d,#74367e); border: 1px solid #f8b5e755;
  box-shadow: 0 3px 14px #de56a259, inset 0 1px #ffffff55;
}