/* Viewport coverage: 320 / 375 / 390 / 414 / 768 / 1024 / 1440 */

@media (max-width: 480px) {
  body {
    background: #eef5f6;
    align-items: stretch;
  }

  .app-shell {
    width: 100%;
    height: 100dvh;
    max-height: none;
    border-radius: 0;
    border: 0;
    box-shadow: none;
  }
}

@media (max-width: 360px) {
  .brand { font-size: 22px; }
  .app-tabs a { font-size: 13px; }
  .feed-card .avatar { width: 56px; height: 56px; }
}

@media (min-width: 414px) and (max-width: 767px) {
  .app-shell {
    width: 100%;
    height: 100dvh;
    border-radius: 0;
    border: 0;
  }
}

@media (min-width: 768px) {
  .app-shell {
    width: 430px;
    height: min(850px, 95vh);
    border-radius: 36px;
    border: 12px solid #000;
  }
}

.app-main.fullbleed {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}