/* V29: focused contrast, solid color surfaces and restrained warm accents. */
:root {
  --v29-forest: #17493a;
  --v29-forest-deep: #10382d;
  --v29-sage: #dfe9e2;
  --v29-sage-strong: #cddfd3;
  --v29-gold: #e8c45b;
  --v29-gold-soft: #f3e7b2;
  --v29-paper: #f7f8f3;
  --v29-ink: #14251e;
}

.contact-button,
.send-button {
  color: #f8faf6 !important;
  background: var(--v29-forest) !important;
  border: 0 !important;
  border-radius: 5px;
  box-shadow: none;
}

.contact-button:hover,
.contact-button:focus-visible,
.send-button:hover,
.send-button:focus-visible {
  color: var(--v29-ink) !important;
  background: var(--v29-gold) !important;
}

.hungry-notes-entry {
  justify-content: flex-start;
  width: 100%;
  min-height: 56px;
  gap: 12px;
  padding: 12px 16px;
  color: var(--v29-forest-deep);
  background: var(--v29-sage);
  border: 0 !important;
  border-radius: 6px;
  box-shadow: none;
}

.hungry-notes-entry:hover,
.hungry-notes-entry:focus-visible {
  background: var(--v29-sage-strong);
}

.hungry-notes-entry .hungry-notes-mark {
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
}

.hungry-notes-entry .notes-cover {
  fill: rgba(23, 73, 58, .09);
}

.hungry-notes-entry .notes-leaf {
  fill: var(--v29-gold);
  stroke: var(--v29-forest-deep);
}

.cafe-float {
  color: var(--v29-ink) !important;
  background: var(--v29-gold) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: 0 16px 36px rgba(64, 50, 13, .22);
}

.cafe-float:hover,
.cafe-float:focus-visible {
  background: #edcd70 !important;
}

.cafe-float-copy small,
.cafe-float-copy strong,
.cafe-float-supporters {
  color: var(--v29-ink) !important;
}

.cafe-float-supporters {
  opacity: .72;
}

.cafe-pay {
  color: var(--v29-ink) !important;
  background: var(--v29-gold) !important;
  border: 0 !important;
  box-shadow: none !important;
}

.cafe-pay:not(:disabled):hover,
.cafe-pay:not(:disabled):focus-visible {
  color: #f8faf6 !important;
  background: var(--v29-forest) !important;
}

.cafe-pay:disabled {
  color: rgba(20, 37, 30, .72) !important;
  background: #eadb9b !important;
  opacity: 1;
}

.tip-form.cafe-tray {
  color: #f8faf6;
  background: var(--v29-forest-deep);
}

.name-studio-banner,
.cafe-float,
.contact-button,
.send-button,
.cafe-pay,
.hungry-notes-entry {
  outline-offset: 3px;
}

.footer-brand-title > span {
  display: block;
  width: max-content;
  max-width: 100%;
  white-space: nowrap;
}

.social-groups button .platform-primary {
  color: var(--white);
  text-align: left;
}

@media (min-width: 981px) {
  .footer-brand-title {
    font-size: clamp(2.35rem, 4.25vw, 4.5rem);
  }
}

@media (max-width: 640px) {
  .name-studio-banner {
    padding-right: 14px;
  }

  .name-studio-banner > strong {
    max-width: 100%;
    font-size: .95rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
  }

  html:not([lang="zh-CN"]) .name-studio-banner > strong {
    width: 100%;
    max-width: none;
    font-size: clamp(.84rem, 3.9vw, .92rem);
    line-height: 1.28;
    overflow-wrap: normal;
    word-break: normal;
    text-wrap: pretty;
  }

  .hungry-notes-entry {
    min-height: 56px;
    padding-inline: 15px;
  }

  .cafe-float {
    width: min(306px, calc(100vw - 20px));
  }

  .cafe-float-copy strong,
  .cafe-float-supporters {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cafe-float-supporters {
    font-size: .58rem;
  }
}
