/* iPhone/iPad touch adaptation. Loaded last so desktop behavior stays intact. */
html, body {
  width: 100%;
  height: 100%;
  overscroll-behavior: none;
  -webkit-text-size-adjust: 100%;
  -webkit-touch-callout: none;
}

button, input, textarea, select, [role="button"] { touch-action: manipulation; }
input, textarea, [contenteditable="true"] { -webkit-user-select: text; user-select: text; }

body.ios-touch {
  --ios-safe-top: env(safe-area-inset-top, 0px);
  --ios-safe-right: env(safe-area-inset-right, 0px);
  --ios-safe-bottom: env(safe-area-inset-bottom, 0px);
  --ios-safe-left: env(safe-area-inset-left, 0px);
  position: fixed;
  inset: 0;
  overflow: hidden;
}

body.ios-touch .desktop { inset: 0; }
body.ios-touch .menubar {
  height: calc(34px + var(--ios-safe-top));
  padding: var(--ios-safe-top) max(8px, var(--ios-safe-right)) 0 max(8px, var(--ios-safe-left));
}
body.ios-touch .menubar-item,
body.ios-touch .status-button,
body.ios-touch .clock-button,
body.ios-touch .menu-button { min-width: 36px; min-height: 34px; }
body.ios-touch #menubar-app-menus { display: none !important; }
body.ios-touch #fullscreen-button { display: none; }
body.ios-touch .clock-button { font-size: 11px; white-space: nowrap; }

body.ios-touch .dock {
  left: max(8px, var(--ios-safe-left));
  right: max(8px, var(--ios-safe-right));
  bottom: max(6px, var(--ios-safe-bottom));
  width: auto;
  max-width: none;
  min-height: 62px;
  padding: 8px 9px 5px;
  transform: none;
  justify-content: flex-start;
  overflow-x: auto;
  overflow-y: visible;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  touch-action: pan-x;
}
body.ios-touch .dock::-webkit-scrollbar { display: none; }
body.ios-touch .dock-item { flex: 0 0 52px; width: 52px; min-height: 52px; scroll-snap-align: center; }
body.ios-touch .dock-icon { width: 48px; height: 48px; border-radius: 13px; }
body.ios-touch .dock-tooltip { display: none !important; }
body.ios-touch .dock-item:hover .dock-icon,
body.ios-touch .dock-item:active .dock-icon { transform: scale(.94); }

body.ios-touch .window {
  left: var(--ios-safe-left) !important;
  top: calc(34px + var(--ios-safe-top)) !important;
  width: calc(100vw - var(--ios-safe-left) - var(--ios-safe-right)) !important;
  height: auto !important;
  bottom: calc(78px + var(--ios-safe-bottom)) !important;
  max-width: none !important;
  max-height: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border-radius: 14px 14px 0 0;
  transform-origin: center bottom;
}
body.ios-touch .window.maximized,
body.ios-touch .window.fullscreen {
  top: var(--ios-safe-top) !important;
  height: calc(100dvh - var(--ios-safe-top) - var(--ios-safe-bottom)) !important;
}
body.ios-touch .titlebar { min-height: 44px; height: 44px; touch-action: none; }
body.ios-touch .window-controls { gap: 10px; min-width: 92px; padding-left: 12px; }
body.ios-touch .window-controls button { width: 18px; height: 18px; }
body.ios-touch .resize-handle { display: none !important; }
body.ios-touch .window-body { overflow: hidden; -webkit-overflow-scrolling: touch; }

body.ios-touch :focus-visible {
  outline: 3px solid rgba(100,210,255,.95) !important;
  outline-offset: 2px;
}
body.ios-touch .desktop-icon:focus-visible {
  border-radius: 12px;
  background: rgba(10,132,255,.32);
}
body.ios-touch.keyboard-visible .dock {
  opacity: 0;
  pointer-events: none;
  transform: translateY(120%) !important;
}
body.ios-touch.keyboard-visible .window {
  bottom: 6px !important;
}

/* Dense desktop toolbars stay complete but become finger-scrollable. */
body.ios-touch .finder-actionbar,
body.ios-touch .finder-toolbar,
body.ios-touch .safari-tabs,
body.ios-touch .safari-fixed-toolbar,
body.ios-touch .g2048-toolbar {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  flex-wrap: nowrap !important;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
body.ios-touch .finder-actionbar::-webkit-scrollbar,
body.ios-touch .finder-toolbar::-webkit-scrollbar,
body.ios-touch .safari-tabs::-webkit-scrollbar,
body.ios-touch .safari-fixed-toolbar::-webkit-scrollbar { display: none; }
body.ios-touch .finder-actionbar button,
body.ios-touch .finder-toolbar button,
body.ios-touch .safari-tabs > *,
body.ios-touch .safari-fixed-toolbar > * { flex: 0 0 auto; }
body.ios-touch .safari-address { min-width: 180px; }

body.ios-touch .desktop-icons { top: calc(48px + var(--ios-safe-top)); right: max(12px, var(--ios-safe-right)); }
body.ios-touch .desktop-icon { min-width: 76px; min-height: 76px; }
body.ios-touch .desktop-widgets { top: calc(48px + var(--ios-safe-top)); left: max(12px, var(--ios-safe-left)); }

body.ios-touch .control-center,
body.ios-touch .notification-center {
  top: calc(38px + var(--ios-safe-top));
  right: max(8px, var(--ios-safe-right));
  width: min(354px, calc(100vw - var(--ios-safe-left) - var(--ios-safe-right) - 16px));
  max-height: calc(100dvh - var(--ios-safe-top) - var(--ios-safe-bottom) - 52px);
}
body.ios-touch .menu-pop,
body.ios-touch .context-menu { max-width: calc(100vw - 20px); max-height: 70dvh; overflow: auto; }
body.ios-touch .menu-item,
body.ios-touch .context-item,
body.ios-touch .tool-button,
body.ios-touch .side-item { min-height: 44px; }

body.ios-touch .spotlight { padding: calc(var(--ios-safe-top) + 56px) 10px 0; }
body.ios-touch .spotlight-panel { width: 100%; max-height: 68dvh; }
body.ios-touch .spotlight-main { grid-template-columns: 1fr; }
body.ios-touch .spotlight-preview { display: none; }

body.ios-touch .launchpad-topbar { top: calc(var(--ios-safe-top) + 40px); left: 16px; right: 16px; }
body.ios-touch .launchpad .launch-grid {
  inset: calc(var(--ios-safe-top) + 145px) 12px calc(var(--ios-safe-bottom) + 12px);
  grid-template-columns: repeat(4, minmax(68px, 1fr));
  gap: 24px 8px;
  padding: 12px 4px 80px;
}
body.ios-touch .launch-icon { width: 60px; height: 60px; }

@media (max-width: 520px) {
  body.ios-touch .desktop-widgets { display: none; }
  body.ios-touch .menu-right .status-button:nth-of-type(1),
  body.ios-touch .menu-right .status-button:nth-of-type(3) { display: none; }
  body.ios-touch .sidebar,
  body.ios-touch .notes-list,
  body.ios-touch .messages-list,
  body.ios-touch .mail-list { width: 112px; min-width: 112px; }
  body.ios-touch .finder-pro-sidebar { width: 108px; padding-inline: 4px; }
  body.ios-touch .finder-pro-sidebar .side-item { padding-inline: 8px; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.ios-touch .finder-pro-main { min-width: 0; }
  body.ios-touch .finder-pro-toolbar { min-width: 0; padding-inline: 6px; }
  body.ios-touch .finder-pro-toolbar .path { min-width: 118px; }
  body.ios-touch .finder-content-pro { min-width: 0; }
  body.ios-touch .launchpad-categories { overflow-x: auto; justify-content: flex-start; }
  body.ios-touch .maps-rich { grid-template-columns: min(42vw, 164px) minmax(0, 1fr); }
  body.ios-touch .maps-sidebar { padding: 8px; }
  body.ios-touch .maps-category-grid { grid-template-columns: repeat(2, 1fr); }
  body.ios-touch .maps-layer-picker { max-width: calc(100% - 16px); overflow-x: auto; }
  body.ios-touch .calc-scientific { overflow: auto; }
  body.ios-touch .calc-workbench { grid-template-columns: 1fr; }
  body.ios-touch .calc-science-keys { grid-template-columns: repeat(4, minmax(42px, 1fr)); }
  body.ios-touch .calc-scientific .calc-key { height: 44px; }
  body.ios-touch .store-grid { grid-template-columns: 1fr; }
  body.ios-touch .safari-start-fixed { padding: 28px 18px 72px !important; }
  body.ios-touch .safari-start-fixed .safari-favorites { grid-template-columns: repeat(3, 1fr) !important; gap: 10px !important; }
}

@media (orientation: landscape) and (max-height: 520px) {
  body.ios-touch .menubar { height: calc(30px + var(--ios-safe-top)); }
  body.ios-touch .window { top: calc(30px + var(--ios-safe-top)) !important; height: auto !important; bottom: calc(66px + var(--ios-safe-bottom)) !important; }
  body.ios-touch .dock { min-height: 52px; padding-block: 4px; }
  body.ios-touch .dock-item { flex-basis: 44px; width: 44px; min-height: 44px; }
  body.ios-touch .dock-icon { width: 40px; height: 40px; border-radius: 11px; }
}

@media (hover: none) and (pointer: coarse) {
  .dock-item:hover .dock-icon, .launch-app:hover .launch-icon, .photo-tile:hover img { transform: none; }
  button:active, [role="button"]:active { opacity: .76; }
}

/* Tahoe Arcade: the desktop keyboard remains supported, but touch is first-class. */
.tetris-touch-controls { display: none; }
body.ios-touch .tetris-touch-controls {
  width: min(310px, 100%);
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 7px;
  margin-top: 10px;
}
body.ios-touch .tetris-touch-controls button {
  min-width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(255,255,255,.12);
  color: white;
  font-size: 19px;
  font-weight: 800;
  box-shadow: inset 0 1px rgba(255,255,255,.12);
}
body.ios-touch .tetris-touch-controls .hard-drop { font-size: 11px; }
body.ios-touch #g2048-grid,
body.ios-touch #tetris-grid { touch-action: none; }

@media (max-width: 620px) {
  body.ios-touch .tetris-app {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 10px;
    overflow: auto;
  }
  body.ios-touch .tetris-board-wrap { min-height: 0; align-content: start; }
  body.ios-touch .tetris-grid { width: min(250px, 72vw); height: auto; aspect-ratio: 1 / 2; }
  body.ios-touch .tetris-side { display: none; }
  body.ios-touch .game2048-app { padding: 12px; overflow: auto; }
  body.ios-touch .game2048-app > header h1 { font-size: 34px; }
  body.ios-touch .g2048-board { width: min(100%, 340px); height: auto; aspect-ratio: 1; margin-inline: auto; }
  body.ios-touch .g2048-controls button { min-width: 44px; min-height: 44px; }
  body.ios-touch .arcade-menu-card,
  body.ios-touch .g2048-menu .arcade-menu-card { padding: 20px; overflow: auto; }
}

@media (max-width: 620px) and (max-height: 650px) {
  body.ios-touch .game2048-app { padding: 7px 10px; gap: 5px; }
  body.ios-touch .game2048-app > header { min-height: 58px; }
  body.ios-touch .game2048-app > header h1 { font-size: 28px; line-height: 1; }
  body.ios-touch .game2048-app > header p { display: none; }
  body.ios-touch .game2048-app > header section span { min-width: 58px; padding: 6px; }
  body.ios-touch .g2048-toolbar { min-height: 38px; }
  body.ios-touch .g2048-toolbar > span { display: none; }
  body.ios-touch .g2048-board { width: min(100%, 226px); }
  body.ios-touch .g2048-controls { display: none; }
  body.ios-touch .tetris-app { overflow: hidden; }
  body.ios-touch .tetris-board-wrap { grid-template-rows: minmax(0, 1fr) auto; }
  body.ios-touch .tetris-grid { width: auto; height: min(285px, 58dvh); }
  body.ios-touch .tetris-touch-controls { margin-top: 6px; }
}
