.ordering-notice {
  position: fixed;
  z-index: 70;
  top: 94px;
  right: clamp(16px, 3vw, 42px);
  display: flex;
  align-items: flex-start;
  gap: 14px;
  width: min(392px, calc(100vw - 32px));
  padding: 18px 19px;
  border: 1px solid rgba(217, 243, 155, .33);
  border-radius: 19px;
  background: #203a2b;
  color: #fffdf5;
  box-shadow: 0 18px 46px rgba(16, 35, 22, .24);
  animation: ordering-notice-enter .32s ease-out both;
}
.ordering-notice-icon {
  display: grid;
  flex: none;
  place-items: center;
  width: 39px;
  height: 39px;
  border-radius: 13px;
  background: #def2ad;
  color: #203a2b;
}
.ordering-notice-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ordering-notice-copy { display: grid; gap: 4px; }
.ordering-notice-copy strong { font-size: 14px; font-weight: 800; letter-spacing: .01em; }
.ordering-notice-copy > span { color: #dce6dc; font-size: 13px; line-height: 1.5; }
@keyframes ordering-notice-enter {
  from { opacity: 0; transform: translateY(-9px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 680px) {
  .ordering-notice { top: auto; right: 12px; bottom: 12px; width: calc(100vw - 24px); padding: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .ordering-notice { animation: none; }
}