.taters-universe {
  --phone-edge-gap: max(12px, env(safe-area-inset-left));
  --phone-edge-gap-right: max(12px, env(safe-area-inset-right));
}

@media (width > 720px) {
  .taters-universe #right-dock {
    width: min(521px, calc(100% - 48px));
  }

  .taters-universe .posts-widget {
    height: min(414px, calc(100vh - 190px));
  }
}

@media (width <= 720px) {
  .taters-universe #top-action-dock,
  .taters-universe #left-dock,
  .taters-universe #right-dock,
  .taters-universe .hud-panel.settings-page,
  .taters-universe .hud-panel.chat-panel {
    left: var(--phone-edge-gap);
    right: var(--phone-edge-gap-right);
    width: auto;
    max-width: none;
    min-width: 0;
  }

  .taters-universe #top-action-dock {
    flex-wrap: wrap;
  }

  .taters-universe .top-ridge-nav {
    flex: 1 1 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    min-width: 0;
    max-width: 100%;
  }

  .taters-universe .hud-panel.posts-widget,
  .taters-universe .hud-panel.music-widget,
  .taters-universe .hud-panel.audio-player-widget {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .taters-universe .posts-widget {
    height: min(315px, calc(100vh - 220px));
  }

  .taters-universe .mac-window {
    left: var(--phone-edge-gap);
    right: var(--phone-edge-gap-right);
    width: auto;
    max-width: none;
    min-width: 0;
    transform: translateY(-50%);
  }

  .taters-universe .posts-list-item,
  .taters-universe .music-track-row,
  .taters-universe .player-transport-row,
  .taters-universe .chat-panel-titlebar {
    min-width: 0;
  }
}
