first commit

node_modules/expo-router/assets/modal.module.css

@@ -0,0 +1,135 @@
+.modal {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  pointer-events: auto;
+  border: var(--expo-router-modal-border, none);
+  box-sizing: border-box;
+  overflow: auto;
+  will-change: transform;
+}
+
+.overlay {
+  position: fixed;
+  inset: 0;
+  background-color: var(--expo-router-modal-overlay-background, rgba(0, 0, 0, 0.25));
+}
+
+@media (min-width: 768px) {
+  .modal {
+    position: relative;
+    z-index: 50;
+    /* iOS 26 modal dimensions: 83% width with max 936px, 79% height with max 586px */
+    width: var(--expo-router-modal-width, 83vw);
+    min-width: var(--expo-router-modal-min-width, auto);
+    /* Max width follows iOS 26 specifications */
+    max-width: var(--expo-router-modal-max-width, min(936px, 83vw));
+    /* iOS 26 height: 79% with max 586px, accounting for viewport padding */
+    height: var(--expo-router-modal-height, 79dvh);
+    max-height: min(var(--expo-router-modal-height, min(586px, 79dvh)), calc(100dvh - 2rem));
+    /* Ensure modal retains a reasonable minimum but never bigger than viewport */
+    min-height: min(var(--expo-router-modal-min-height, var(--expo-router-modal-height, min(586px, 79dvh))), calc(100dvh - 2rem));
+    /*
+      It is super expensive to calculate the shadow with box-shadow, so we have to use filter instead.
+      Do not change this to box-shadow. Box-shadow caused an INP of 600ms on the modal.
+    */
+    filter: var(--expo-router-modal-shadow, drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) drop-shadow(0 4px 3px rgb(0 0 0 / 0.1)));
+    overflow: auto;
+    outline: none;
+  }
+
+  .modalWrap>.modal {
+    pointer-events: auto;
+  }
+}
+
+.drawerContent {
+  position: fixed;
+  display: flex;
+  flex-direction: column;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 100%;
+  outline: none;
+}
+
+body>.transparentDrawerContent {
+  position: fixed;
+  display: flex;
+  flex-direction: column;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 100%;
+  outline: none;
+  animation: none;
+  animation-name: none;
+}
+
+@media (min-width: 768px) {
+  .drawerContent {
+    max-height: 100%;
+    pointer-events: box-none;
+  }
+}
+
+.modal::-webkit-scrollbar {
+  width: 0px;
+  height: 0px;
+}
+
+.modal::-webkit-scrollbar-thumb {
+  background: transparent;
+}
+
+.modalBody {
+  display: flex;
+  flex: 1;
+  overflow: auto;
+  box-sizing: border-box;
+}
+
+/* Ensure bottom sheets (inside drawerContent) can shrink to any detent */
+.drawerContent .modal[data-presentation='formSheet'],
+.drawerContent .modal[data-presentation='containedModal'] {
+  /* Reset inherited centering */
+  position: relative;
+  transform: none;
+  box-shadow: none;
+  filter: none;
+  border-radius: inherit;
+  min-height: auto;
+  max-height: none;
+}
+
+/* Form-sheet style (snap-point based) should be full width */
+.drawerContent .modal[data-presentation='formSheet'],
+.drawerContent .modal[data-presentation='containedModal'] {
+  width: 100%;
+  max-width: none;
+}
+
+/* Regular modal keeps desktop max-width for nicer look */
+.drawerContent .modal[data-presentation='modal'],
+.drawerContent .modal[data-presentation='fullScreenModal'] {
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  /* Use the same sizing variables as the primary desktop rule - iOS 26 dimensions */
+  width: var(--expo-router-modal-width, 83vw);
+  min-width: var(--expo-router-modal-min-width, auto);
+  max-width: var(--expo-router-modal-max-width, min(936px, 83vw));
+  margin: 0;
+  /*
+    It is super expensive to calculate the shadow with box-shadow, so we have to use filter instead.
+    Do not change this to box-shadow. Box-shadow caused an INP of 600ms on the modal.
+  */
+  filter: var(--expo-router-modal-shadow, drop-shadow(0px 25px 50px rgba(0, 0, 0, 0.3)));
+  border-radius: var(--expo-router-modal-border-radius, 24px);
+}
+
+.srOnly {
+  display: none;
+}

node_modules/expo-router/assets/native-tabs.module.css

@@ -0,0 +1,109 @@
+:root {
+  --expo-router-tabs-font-family: --apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+}
+
+.nativeTabsContainer {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  max-height: 100vh;
+  max-width: 100vw;
+  overflow: hidden;
+}
+
+.tabContent {
+  flex: 1;
+  display: flex;
+  max-height: 100%;
+  max-width: 100%;
+}
+.tabContent[data-state="inactive"] {
+  display: none;
+}
+
+.navigationMenuRoot {
+  top: 24px;
+  left: 50%;
+  transform: translateX(-50%);
+  position: fixed;
+  z-index: 10;
+  display: flex;
+  background-color: var(--expo-router-tabs-background-color, #272727);
+  height: 40px;
+  border-radius: 25px;
+  align-items: center;
+  justify-content: flex-start;
+  padding: 5px;
+  box-sizing: border-box;
+  margin: 0;
+  max-width: 90vw;
+  overflow-x: auto;
+}
+
+.navigationMenuTrigger {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  list-style-position: inside;
+  height: 100%;
+  background-color: transparent;
+  border: none;
+  margin: 0;
+  height: 100%;
+  border-radius: 20px;
+  padding: 0 20px;
+  cursor: pointer;
+  outline-color: var(--expo-router-tabs-tab-outline-color, #444444);
+  position: relative;
+}
+
+.navigationMenuTrigger[data-state="active"] {
+  background-color: var(--expo-router-tabs-active-background-color, #444444);
+}
+
+.tabText {
+  font-weight: var(--expo-router-tabs-font-weight, 500);
+  font-size: var(--expo-router-tabs-font-size, 15px);
+  font-family: var(--expo-router-tabs-font-family);
+  font-style: var(--expo-router-tabs-font-style, normal);
+  opacity: var(--expo-router-tabs-text-opacity, 1);
+  color: var(--expo-router-tabs-text-color, #8b8b8b);
+  white-space: nowrap;
+}
+
+.navigationMenuTrigger[data-state="active"] .tabText {
+  color: var(--expo-router-tabs-active-text-color, #ffffff);
+  font-size: var(--expo-router-tabs-active-font-size, var(--expo-router-tabs-font-size, 15px));
+}
+
+.navigationMenuTrigger:not([data-state="active"]) .tabText:hover {
+  opacity: var(--expo-router-tabs-text-hover-opacity, 0.6);
+}
+
+.tabBadge {
+  --expo-router-tabs-local-badge-size: var(--expo-router-tabs-badge-size, 20px);
+
+  font-family: var(--expo-router-tabs-font-family);
+  position: absolute;
+  right: 0;
+  top: 0;
+  min-width: var(--expo-router-tabs-local-badge-size);
+  padding: 2px 4px;
+  width: auto;
+  height: var(--expo-router-tabs-local-badge-size);
+  box-sizing: border-box;
+  border-radius: calc(var(--expo-router-tabs-local-badge-size) / 2);
+  background-color: var(--expo-router-tabs-badge-background-color, red);
+  color: var(--expo-router-tabs-badge-text-color, #ffffff);
+  font-size: 12px;
+  text-align: center;
+}
+
+.emptyTabBadge {
+  --expo-router-tabs-local-badge-size: var(--expo-router-tabs-empty-badge-size, 14px);
+
+  right: 4px;
+  min-width: var(--expo-router-tabs-local-badge-size);
+  min-height: var(--expo-router-tabs-local-badge-size);
+  border-radius: calc(var(--expo-router-tabs-local-badge-size) / 2);
+}