:root {
  --header-size: calc(96px + var(--safe-top));
}

.birthday-header {
  gap: 12px;
  padding-inline: max(16px, 4vw, env(safe-area-inset-left)) max(16px, 4vw, env(safe-area-inset-right));
}

.birthday-header .brand {
  flex-shrink: 0;
  white-space: nowrap;
}

.song-player {
  flex: 0 1 320px;
  min-width: 280px;
  height: 80px;
  border-radius: 12px;
}

.song-player iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: inherit;
}

@media (max-width: 460px) {
  .birthday-header { gap: 8px; }
  .birthday-header .brand { flex-direction: column; gap: 2px; }
}

@media (max-width: 386px) {
  .birthday-header {
    gap: 4px;
    padding-inline: max(8px, env(safe-area-inset-left)) max(8px, env(safe-area-inset-right));
  }
  .birthday-header .brand-star { font-size: 20px; }
  .birthday-header .brand-name { display: none; }
  .song-player { min-width: min(280px, calc(100vw - 32px)); }
}

.mic-guide{border:1px solid #c9b08b;background:#fffaee;border-radius:9px;padding:12px 14px;margin:10px 0 15px;color:#71573d;text-align:left}.mic-guide[hidden]{display:none}.mic-guide p{font-size:12px;line-height:1.6;margin:0 0 8px}.mic-meter{height:6px;background:#e1d3bb;border-radius:6px;overflow:hidden}.mic-meter i{display:block;height:100%;width:0;background:#859660;transition:width .07s;border-radius:6px}.mic-guide .mic-sensitive{padding:7px 0;min-height:38px;margin:4px 0 0;border:0;background:none;font-size:12px;text-decoration:underline;text-underline-offset:4px;color:#7d5c31}.mic-guide .mic-level-label{font-size:10px;letter-spacing:.7px;margin:0 0 5px;color:#7b684f}.mic-button:disabled{opacity:.65;cursor:wait}.mic-privacy a{color:inherit;text-underline-offset:3px}