.goalMeta {
  font-size: 12px;
  color: var(--muted);
}

.goalJournalPage .modalOverlay {
  z-index: 120;
}

.goalJournalPage .modalBackdrop {
  border-radius: 0;
  background: rgba(15, 23, 42, 0.28);
}

.goalJournalPage nav {
  z-index: 20;
}

.goalJournalPage nav {
  width: min(calc(100vw - 16px), var(--shell-max));
  padding: 6px 8px calc(8px + env(safe-area-inset-bottom));
  border-radius: 18px 18px 0 0;
  display: block;
  grid-template-columns: none;
  gap: 0;
}

.goalJournalPage .app {
  padding-bottom: 118px;
}

.journalNote {
  white-space: pre-wrap;
  margin: 8px 0 0;
}

.moodPill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  min-height: 24px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  background: #fff;
}

.metaChipRow {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0 8px;
}

.metaChip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border: 1px solid #dadce0;
  border-radius: 999px;
  background: #f8f9fa;
  color: #3c4043;
  font-size: 12px;
  font-weight: 600;
}

.goalNav {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: end;
  gap: 0;
}

.goalNavBtn {
  min-height: 64px;
  background: transparent;
  border: 0;
  color: #7a869a;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
}

.goalNavBtn .tabIcon {
  font-size: 22px;
}

.goalNavBtn.active {
  color: #1a73e8;
}

.goalNavAdd {
  width: 68px;
  height: 68px;
  margin: 0 auto 6px;
  border: 0;
  border-radius: 50%;
  background: #1a73e8;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 20px rgba(26, 115, 232, 0.28);
}

.goalNavAdd i {
  font-size: 32px;
}

@media (max-width: 760px) {
  .goalJournalPage .app {
    padding-bottom: 112px;
  }

  .goalJournalPage nav {
    width: calc(100vw - 12px);
    padding: 6px 6px calc(6px + env(safe-area-inset-bottom));
    display: block;
    grid-template-columns: none;
    gap: 0;
  }

  .goalNavBtn {
    min-height: 58px;
  }

  .goalNavBtn .tabIcon {
    font-size: 20px;
  }

  .goalNavAdd {
    width: 62px;
    height: 62px;
    margin-bottom: 4px;
  }

  .goalNavAdd i {
    font-size: 28px;
  }
}