/* Mobile readability and shared right-side action balance. */
.record-pills {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap !important;
  gap: 4px !important;
  min-width: 0;
}

.record-pills span {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: max-content;
  overflow: hidden;
  padding: 6px 7px !important;
  font-family: "Hiragino Maru Gothic ProN", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 9.5px;
  letter-spacing: 0;
  text-overflow: clip;
  white-space: nowrap;
}

/* 記録や操作は、会話に近い柔らかなゴシック体にする。 */
.time-record-row,
.record-inline-action,
.record-pills,
.record-pills span,
.side-actions,
nav,
button,
select,
input {
  font-family: "Hiragino Maru Gothic ProN", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

/* お手紙・占いの本文は、これまでの明朝体を維持する。 */
.message .free p,
.message .premium p,
.today-letter p,
.letter-closing p,
.message-intro h2 {
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
}

.side-actions {
  top: 50% !important;
  right: max(0px, calc(50vw - 240px)) !important;
  width: 46px !important;
  transform: translateY(-50%) !important;
}

.side-action {
  box-sizing: border-box;
  width: 46px !important;
  height: 100px !important;
  min-height: 100px !important;
  padding: 8px 5px !important;
  gap: 0 !important;
}

.side-action > span { display: none !important; }

.side-action b {
  font-size: 10px !important;
  line-height: 1.2 !important;
  letter-spacing: .03em !important;
}

.kokoro-entry-float {
  top: calc(50% - 156px) !important;
  right: max(0px, calc(50vw - 240px)) !important;
  width: 56px !important;
  height: 56px !important;
}

@media (max-width: 380px) {
  .record-pills {
    gap: 4px !important;
  }

  .record-pills span {
    padding-inline: 5px !important;
    font-size: 9px;
    letter-spacing: -.02em;
  }
}

@media (max-height: 620px) {
  .side-action {
    height: 86px !important;
    min-height: 86px !important;
  }

  .kokoro-entry-float {
    top: calc(50% - 142px) !important;
  }
}
