.guest-voice-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.pos-ico { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.guest-voice-float { position: fixed; bottom: calc(90px + env(safe-area-inset-bottom)); left: calc(50% - 38px); width: 76px; height: 84px; z-index: 105; }
.guest-voice-float[hidden] { display: none; }
#micFab { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; width: 76px; height: 84px; padding: 0; border: 1px solid #ffffff65; border-radius: 22px; background: #2f73c9; color: #fff; box-shadow: 0 5px 15px #2f73c940, inset 0 1px 1px #ffffff4d; cursor: pointer; touch-action: none; animation: voice-arrive .55s cubic-bezier(.2,.8,.3,1.2) both, voice-color 12s 1s ease-in-out infinite, var(--voice-intro-motion, none); }
.guest-voice-float.is-introducing { --voice-intro-motion: voice-intro-nudge .72s ease-in-out; }
#micFab { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; }
#micFab .pos-ico { width: 30px; height: 30px; pointer-events: none; }
.guest-voice-float.has-interacted #micFab:not(.recording):not(.busy) { animation: voice-color 12s 1s ease-in-out infinite; }
.guest-voice-float.is-dragging #micFab { cursor: grabbing; }
#micFab:focus-visible { outline: 3px solid #245a9e; outline-offset: 5px; }
#micFab.recording { background: #e63751; animation: voice-record 1.5s ease-in-out infinite; }
#micFab.recording::before, #micFab.recording::after { content: ""; position: absolute; inset: -5px; border: 2px solid #e6375166; border-radius: 26px; pointer-events: none; animation: voice-listen-ring 1.8s ease-out infinite; }
#micFab.recording::after { animation-delay: .9s; }
#micFab.busy { background: #75a2df; animation: none; }
.guest-voice-sr { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.guest-voice-ring { position: absolute; inset: -5px; width: 86px; height: 94px; fill: none; stroke: #82b0ec; stroke-width: 2; stroke-linecap: round; stroke-dasharray: 19 81; pointer-events: none; opacity: 0; animation: voice-ring 11s 1.5s ease-in-out infinite; }
.guest-voice-float.is-active .guest-voice-ring { animation: none; }
.guest-voice-intro, #micHint { position: absolute; bottom: calc(100% + 15px); left: calc(50% + var(--voice-hint-offset, 0px)); transform: translateX(-50%); width: max-content; max-width: min(224px, calc(100vw - 24px)); padding: 11px 15px; margin: 0; border: 1px solid #cbdcf4; border-radius: 16px; background: #f4f8ff; color: #285da4; box-shadow: 0 4px 16px #285da41c; font-size: 0.875rem; line-height: 1.6; text-align: center; transition: opacity .22s, transform .22s; pointer-events: none; }
.guest-voice-intro::after, #micHint::after { content: ''; position: absolute; bottom: -5px; left: calc(50% - var(--voice-hint-offset, 0px)); width: 9px; height: 9px; transform: translateX(-50%) rotate(45deg); border-right: 1px solid #cbdcf4; border-bottom: 1px solid #cbdcf4; background: #f4f8ff; }
.guest-voice-intro { max-width: min(300px, calc(100vw - 24px)); font-size: 1.125rem; font-weight: 650; text-wrap: balance; white-space: pre-line; }
.guest-voice-intro[hidden] { display: none; }
.guest-voice-intro.is-leaving { opacity: 0; transform: translate(-50%, 4px); }
.guest-voice-float.is-top .guest-voice-intro, .guest-voice-float.is-top #micHint { bottom: auto; top: calc(100% + 15px); }
.guest-voice-float.is-top .guest-voice-intro::after, .guest-voice-float.is-top #micHint::after { top: -5px; bottom: auto; border: 0; border-left: 1px solid #cbdcf4; border-top: 1px solid #cbdcf4; }
#micHint { display: none; width: min(224px, calc(100vw - 24px)); pointer-events: auto; }
#micHintText { display: block; white-space: pre-line; }
.guest-record-actions { display: flex; gap: 8px; margin-top: 10px; }
.guest-record-actions button { flex: 1; min-width: 0; min-height: 44px; padding: 8px 4px; border: 0; border-radius: 10px; font: inherit; font-size: 0.875rem; font-weight: 650; cursor: pointer; touch-action: manipulation; }
.guest-record-cancel { background: #e8eef7; color: #344054; }
.guest-record-done { background: #e63751; color: #fff; }
#micHint.show { display: block; }
/* 語音鈕底下的字：沒用過的人看得懂這是點餐用的 */
.guest-mic-label { font-size: 1rem; font-weight: 700; line-height: 1; letter-spacing: .1em; pointer-events: none; }
#micFab.busy .guest-mic-label { font-size: 0.8125rem; letter-spacing: 0; }
/* 沒聽清楚：教客人怎麼講 */
#micHint[data-tip] { width: max-content; max-width: min(260px, calc(100vw - 24px)); transform-origin: 0 50%; font-size: 1rem; font-weight: 650; animation: voice-stage-pop .32s cubic-bezier(.2,.8,.3,1.3); }
#micHint[data-tip], #micHint[data-tip]::after { border-color: #f1d29b; background: #fff8eb; color: #8a5300; }
@keyframes voice-arrive { from { opacity: 0; transform: translateY(14px) scale(.8); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes voice-intro-nudge { 0%, 100% { translate: 0; } 20% { translate: -3px; } 40% { translate: 3px; } 60% { translate: -2px; } 80% { translate: 2px; } }
@keyframes voice-color { 0%, 35%, 100% { background-color: #2f73c9; } 60% { background-color: #548fe0; } }
/* 外框是圓角方塊，亮線沿著框跑一圈多 */
@keyframes voice-ring { 0%, 50% { opacity: 0; stroke-dashoffset: 0; } 58% { opacity: .85; } 83% { opacity: .85; } 100% { opacity: 0; stroke-dashoffset: -117; } }
@keyframes voice-record { 0%, 100% { box-shadow: 0 0 0 0 #e6375138; } 50% { box-shadow: 0 0 0 7px #e6375114; } }
@media (prefers-reduced-motion: reduce) { #micFab, .guest-voice-ring { animation: none; } .guest-voice-intro { transition: none; } }
.pos-modal-overlay { position: fixed; inset: 0; z-index: 110; background: #10182888; display: none; padding: 16px; align-items: center; justify-content: center; }
.pos-modal-overlay.show { display: flex; }
.pos-confirm-box { width: min(580px, 100%); max-height: 90dvh; overflow: auto; background: #fff; border-radius: 18px; padding: 20px; }
.pos-confirm-actions { display: flex; justify-content: flex-end; margin-top: 16px; }
.pos-confirm-actions button { padding: 10px 20px; border: 0; border-radius: 12px; font: inherit; }
.pos-voice-pick-list { display: flex; flex-direction: column; gap: 10px; }
.pos-voice-pick-item { display: flex; justify-content: space-between; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: #fff; font-size: 1.0625rem; color: var(--ink); text-align: left; }
.pos-voice-pick-look { width: 44px; height: 44px; border-radius: 10px; overflow: hidden; }
.pos-voice-pick-look img { width: 100%; height: 100%; object-fit: cover; }
body.guest-voice-review-open { overflow: hidden; }
.guest-voice-review-overlay { position: fixed; inset: 0; z-index: 110; display: none; justify-content: center; background: #10182870; }
.guest-voice-review-overlay.show { display: flex; }
.guest-voice-review { display: flex; flex-direction: column; width: min(760px, 100%); height: 100%; height: 100dvh; background: var(--bg); color: var(--ink); }
.guest-review-header { display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; gap: 10px; padding: calc(12px + env(safe-area-inset-top)) 16px 12px; border-bottom: 1px solid var(--line); background: #fff; }
.guest-review-heading { display: flex; align-items: center; gap: 12px; }
.guest-review-heading h2 { font-size: 1.375rem; margin: 0; white-space: nowrap; }
.guest-review-voice { display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--ink); white-space: nowrap; }
.guest-review-voice .pos-ico { width: 21px; height: 21px; color: #2f73c9; }
.guest-review-voice.recording { color: #fff; background: #e63751; }
.guest-review-voice.recording .pos-ico { color: inherit; }
.guest-review-voice:disabled { opacity: .55; }
.guest-review-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 14px 16px 24px; }
#voiceHeardText { margin: 0 0 14px; font-size: 0.8125rem; line-height: 1.6; color: var(--muted); overflow-wrap: anywhere; }
#voiceDraftStatus { margin: 0 0 14px; padding: 10px 12px; border-radius: 10px; background: #f3f4f6; color: #475467; font-size: 0.875rem; line-height: 1.5; }
#voiceDraftStatus.is-live { background: #f4f8ff; color: #285da4; }
#voiceDraftStatus.is-error, #voiceDraftStatus.is-warn { color: #b45309; background: #fffbeb; }
.guest-review-row { margin-bottom: 12px; border: 1px solid var(--line); border-radius: 16px; padding: 14px; background: #fff; cursor: pointer; touch-action: manipulation; }
.guest-review-row-heading { display: flex; align-items: flex-start; gap: 10px; }
.guest-review-item { display: flex; flex: 1; min-width: 0; flex-direction: column; align-items: flex-start; gap: 4px; padding: 0; border: 0; background: none; text-align: left; color: var(--ink); cursor: pointer; }
.guest-review-item strong { flex: 1; min-width: 0; color: var(--ink); font-size: 1.0625rem; line-height: 1.5; overflow-wrap: anywhere; }
.guest-review-item > span:last-child { color: var(--muted); font-size: 0.8125rem; line-height: 1.6; }
.guest-review-item-name { display: flex; align-items: center; gap: 8px; width: 100%; }
.guest-review-edit-label { display: inline-flex; align-items: center; justify-content: center; gap: 5px; flex-shrink: 0; min-height: 44px; padding: 6px 10px; border: 1px solid #f3d2b3; border-radius: 12px; background: #fff4ea; color: #ae5010; font-size: 1.125rem; font-weight: 750; }
.guest-review-edit-label .pos-ico { width: 18px; height: 18px; }
.guest-review-remove { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; padding: 12px; border: 0; border-radius: 12px; background: #f3f4f6; color: var(--muted); }
.guest-review-remove .pos-ico { display: block; width: 20px; height: 20px; }
.guest-selected-options { margin-top: 12px; }
.guest-selected-options:empty { display: none; }
.guest-selected-options .chip { text-align: left; }
.guest-review-note { margin-top: 10px; }
.guest-review-note-button { display: inline-flex; gap: 5px; align-items: center; min-height: 32px; padding: 4px 0; border: 0; background: none; color: var(--muted); font-size: 0.8125rem; line-height: 1.5; text-align: left; }
.guest-review-note-button .pos-ico { display: block; width: 15px; height: 15px; }
.guest-review-note .remark-label { margin: 0; }
.guest-review-meal-quantity { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #f0f1f3; }
.guest-review-meal-quantity > span { color: var(--muted); font-size: 0.875rem; font-weight: 600; }
.guest-review-meal-quantity .qty { margin: 0; gap: 9px; }
.guest-review-meal-quantity .qty-num { min-width: 16px; text-align: center; font-size: 1.0625rem; font-weight: 750; }
.guest-review-unit { font-size: 0.8125rem; color: var(--muted); margin-left: -5px; }
.guest-review-meal-quantity button:disabled { opacity: .35; }
.guest-review-meal-quantity .qty button { width: 44px; height: 44px; }
.guest-review-options { flex: 1; min-height: 0; padding: 20px; overflow-y: auto; overscroll-behavior: contain; }
.guest-review-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.guest-review-options .opt-group:last-child { margin-bottom: 0; }
.guest-review-options .opt-title { line-height: 1.6; }
.guest-review-options .chip { text-align: left; }
.guest-review-no-options { color: var(--muted); font-size: 0.875rem; }
.guest-review-total { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.guest-review-total > span { color: var(--muted); font-size: 0.875rem; }
.guest-review-total strong { color: var(--ink); font-size: 1.3125rem; }
.guest-review-actions { display: flex; gap: 10px; }
.guest-review-actions > button { flex: 1; min-width: 0; min-height: 50px; padding: 0 12px; }
#voiceDraftCancelRecording { order: -1; }
.guest-review-row button, .guest-review-actions button { touch-action: manipulation; }
.guest-addon-dialog { z-index: 131; width: min(320px, calc(100vw - 40px)); padding: 24px 20px 20px; }
#voiceAddonMask { z-index: 130; }
.guest-addon-dialog h2 { margin: 0 0 18px; font-size: 1.25rem; color: var(--ink); }
.guest-addon-item { margin: 0 0 5px; color: var(--muted); font-size: 0.8125rem; line-height: 1.5; }
.guest-addon-dialog .opt-qty-name { margin: 0; font-size: 1.125rem; line-height: 1.6; }
.guest-addon-price { margin: 8px 0 20px; font-size: 0.8125rem; color: var(--muted); }
.guest-addon-stepper { display: flex; align-items: center; justify-content: center; gap: 22px; padding: 14px; border: 1px solid #e5e7eb; border-radius: 12px; background: #f8fafc; }
.guest-addon-stepper button { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; border: 1px solid #d2dae4; border-radius: 9px; background: #fff; color: #475467; font-size: 1.5rem; line-height: 1; }
.guest-addon-stepper button:disabled { opacity: .4; }
#voiceAddonQty { min-width: 28px; font-size: 1.5rem; font-weight: 750; }
.guest-addon-remove { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%; min-height: 44px; margin: 12px 0 8px; border: 0; border-radius: 10px; background: none; color: #9b626b; font-size: 0.875rem; }
.guest-addon-remove .pos-ico { display: block; width: 18px; height: 18px; }
@media (max-width: 360px) { .guest-review-header { padding-left: 12px; padding-right: 12px; } .guest-review-heading { gap: 8px; } .guest-review-body { padding-left: 12px; padding-right: 12px; } .guest-review-row { padding: 12px; } }

.guest-options-mask { position: fixed; inset: 0; z-index: 120; background: #10182870; }
.guest-options-dialog { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 121; display: flex; flex-direction: column; width: min(520px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); border-radius: 20px; background: #fff; box-shadow: 0 16px 48px #10182830; overflow: hidden; }
.guest-options-dialog:focus { outline: none; }
.guest-options-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 20px; border-bottom: 1px solid var(--line); }
.guest-options-head > div:first-child { min-width: 0; }
.guest-options-head p { margin: 0 0 6px; color: var(--muted); font-size: 0.875rem; }
.guest-options-head h2 { margin: 0; font-size: 1.375rem; line-height: 1.4; overflow-wrap: anywhere; }
.guest-options-head .guest-options-price { margin: 8px 0 0; color: var(--brand); font-size: 1.0625rem; font-weight: 750; }
.guest-options-actions { display: flex; flex-shrink: 0; gap: 10px; padding: 16px 20px; border-top: 1px solid var(--line); }
.guest-options-actions button { flex: 1; min-width: 0; min-height: 50px; }
.guest-options-actions .btn-main { flex: 1.5; white-space: nowrap; }
.guest-options-error { margin: 0; padding: 10px 20px; color: #b45309; background: #fffbeb; font-size: 0.875rem; line-height: 1.5; }
.guest-listening-bars { display: none; align-items: center; justify-content: center; gap: 3px; width: 24px; height: 26px; flex-shrink: 0; pointer-events: none; }
.guest-listening-bars i { display: block; flex: 1; max-width: 4px; height: 24px; border-radius: 4px; background: currentColor; transform: scaleY(.4); animation: voice-listen-wave .85s ease-in-out infinite alternate; }
.guest-listening-bars i:nth-child(2), .guest-listening-bars i:nth-child(4) { animation-delay: -.45s; }
.guest-listening-bars i:nth-child(3) { animation-delay: -.25s; }
.guest-listening-bars i:nth-child(5) { animation-delay: -.65s; }
#micFab.recording .pos-ico, .guest-review-voice.recording .pos-ico { display: none; }
#micFab.recording .guest-listening-bars, .guest-review-voice.recording .guest-listening-bars { display: flex; }
#micFab .guest-listening-bars { width: 32px; height: 32px; }
#micFab .guest-listening-bars i { height: 30px; }
body.is-voice-recording #micHint, body.is-voice-recording #micHint::after { background: #fff6f7; border-color: #f4c7cf; color: #b4233f; }
body.is-voice-recording #voiceDraftStatus.is-live { background: #fff6f7; color: #b4233f; }
@keyframes voice-listen-ring { from { opacity: .7; transform: scale(.95); } to { opacity: 0; transform: scale(1.4); } }
@keyframes voice-listen-wave { from { transform: scaleY(.25); } to { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) { #micFab.recording::before, #micFab.recording::after, .guest-listening-bars i { animation: none; } .guest-listening-bars i:nth-child(2n) { transform: scaleY(.75); } }

#voicePickOverlay { z-index: 140; }
.pos-voice-pick-name { flex: 1; min-width: 0; }
.pos-voice-pick-look { flex-shrink: 0; margin-left: 12px; }

/* AI 點數用完：語音點餐、打字點餐、語音修改都收起來，只留一般點餐 */
.ai-voice-off #guestVoiceFloat,
.ai-voice-off #voiceDraftMic,
.ai-voice-off #textChatPanel {
  display: none !important;
}
/* 語音等待進度：聽到了、翻菜單時點點跳動，找到了跳一下 */
.guest-stage-dots { display: none; gap: 3px; margin-left: 5px; vertical-align: middle; }
.guest-stage-dots i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; opacity: .45; animation: voice-stage-dot 1s ease-in-out infinite; }
.guest-stage-dots i:nth-child(2) { animation-delay: .15s; }
.guest-stage-dots i:nth-child(3) { animation-delay: .3s; }
/* 框用 translateX(-50%) 置中，縮放中心要設在左邊界（也就是畫面上的正中間），彈出時才不會往旁邊滑 */
#micHint[data-stage] { width: max-content; max-width: min(260px, calc(100vw - 24px)); transition: opacity .22s; transform-origin: 0 50%; }
.guest-stage-rest { visibility: hidden; }
#micHint[data-stage] #micHintText { display: inline; font-size: 1rem; font-weight: 650; }
#micHint[data-stage="heard"] { animation: voice-stage-pop .32s cubic-bezier(.2,.8,.3,1.3); }
#micHint[data-stage="menu"] { animation: voice-stage-flip .5s ease-in-out; }
#micHint[data-stage="heard"] .guest-stage-dots, #micHint[data-stage="menu"] .guest-stage-dots { display: inline-flex; }
#micHint[data-stage="found"] { border-color: #bfe3cf; background: #f1fbf5; color: #1f7a4d; animation: voice-stage-found .45s cubic-bezier(.2,.8,.3,1.4); }
#micHint[data-stage="found"]::after { border-color: #bfe3cf; background: #f1fbf5; }
#micFab.busy { animation: voice-busy 1.1s ease-in-out infinite; }
@keyframes voice-stage-dot { 0%, 60%, 100% { translate: 0 0; opacity: .45; } 30% { translate: 0 -4px; opacity: 1; } }
@keyframes voice-stage-pop { from { scale: .9; opacity: .3; } to { scale: 1; opacity: 1; } }
@keyframes voice-stage-flip { 0%, 100% { scale: 1 1; } 30% { scale: .9 1; } 60% { scale: 1.04 1; } }
@keyframes voice-stage-found { 0% { scale: .9; } 45% { scale: 1.06; translate: 0 -5px; } 100% { scale: 1; translate: 0 0; } }
@keyframes voice-busy { 0%, 100% { scale: 1; } 50% { scale: .94; } }
@media (prefers-reduced-motion: reduce) { #micHint[data-stage], #micFab.busy, .guest-stage-dots i { animation: none; } }
