/* Movimento independente da rotação original do celular. */
.ai-note { animation: flutuar 6s ease-in-out infinite; }
.confirmation { animation: flutuar 7s ease-in-out -3s infinite; }
.phone { animation: flutuar 8s ease-in-out -2s infinite; }
@keyframes flutuar { 0%,100% { translate: 0 0; } 50% { translate: 0 -10px; } }
.phone:hover,.phone:focus-within { animation-play-state: paused; }
.feature .demo { height: 282px; padding: 20px 20px 0; }
.demo .mini-panel { min-height: 262px; padding: 18px; }
.demo button { cursor: pointer; color: inherit; font: inherit; border: 0; }
.demo .days button { flex: 1; padding: 10px 2px; background: #f4f5ef; border-radius: 5px; font-size: 10px; line-height: 1.6; }
.demo .slots button { flex: 1; padding: 9px 2px; background: #e9f2dc; border-radius: 5px; color: #426240; font-size: 9px; }
.demo button[aria-pressed="true"] { background: var(--forest); color: white; }
.demo button:focus-visible { outline: 2px solid #4d8341; outline-offset: 2px; }
.demo button:hover { box-shadow: inset 0 0 0 1px #789862; }
.demo-status { min-height: 30px; margin: 12px 0 5px; font-size: 10px; line-height: 1.5; color: #426240; }
.demo .queue-row { width: 100%; text-align: left; background: transparent; padding: 11px 7px; border-radius: 5px; }
.demo .queue-row[aria-pressed="true"] i { color: #d1ee8e; }
.demo .food-row { width: 100%; text-align: left; background: transparent; border-radius: 7px; padding: 6px; margin: 4px 0; gap: 10px; }
.demo .food-row img { width: 46px; height: 40px; }
.demo .food-row strong { font-size: 10px; }
.demo .food-row span { font-size: 9px; }
.demo .food-row[aria-pressed="true"] span { color: #dce7d7; }
.demo .mini-title { margin-bottom: 12px; }
.demo-caption { font-size: 9px; line-height: 1.4; }
@media(max-width:720px) { .feature .demo { height: 282px; } }
@media(prefers-reduced-motion:reduce) { .ai-note,.confirmation,.phone { animation: none; translate: none; } }