/* The warm learning companion stays separate from the merchant workspace. */
.narration-controls{--voice-ink:#463c2d;--voice-green:#087961;--voice-muted:#776d5c;--voice-paper:#fffaf0;--voice-line:#e6d8b8;box-sizing:border-box;color:var(--voice-ink);text-align:left;font-family:var(--body)}
.voice-control-row{display:flex;align-items:center;gap:10px}
.voice-toggle,.voice-replay,.voice-play{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:36px;padding:6px 4px;border:0;background:transparent;color:var(--voice-ink);font:inherit;cursor:pointer;white-space:nowrap;border-radius:7px}
.voice-toggle span,.voice-replay span,.voice-play span{font-size:12px;font-weight:600;line-height:1.4}
.voice-toggle svg,.voice-replay svg,.voice-play svg{width:16px;height:16px;flex-shrink:0}
.voice-play{background:#365c4c;color:#fff;padding:6px 12px;min-width:73px}.voice-toggle{margin-left:auto}.voice-replay{color:var(--voice-muted)}
.voice-toggle:hover,.voice-replay:hover{background:#eee4cd}.voice-play:hover{background:#244637}
.narration-controls button:focus-visible,.voice-transcript:focus-visible,[data-voice-transcript]:focus-visible{outline:2px solid #9b712e;outline-offset:3px;border-radius:6px}
.narration-controls button:disabled{opacity:.5;cursor:default}
.voice-slash{display:none}.voice-toggle[aria-pressed=false] .voice-waves{display:none}.voice-toggle[aria-pressed=false] .voice-slash{display:block}
.voice-caption{display:flex;align-items:center;gap:6px;margin-top:9px;min-height:19px;font-size:11px;line-height:1.5;color:var(--voice-muted)}
.voice-status{flex:1}.voice-ai{font-size:10px;color:var(--voice-muted);white-space:nowrap}
/* A blocked automatic attempt needs an explicit, usable activation control. */
[data-narration][data-mode=blocked] .voice-control-row{flex-wrap:wrap}
[data-narration][data-mode=blocked] .voice-play{flex-basis:100%;min-height:42px;background:#986919;color:#fff;box-shadow:0 2px 0 #70501925}
[data-narration][data-mode=blocked] .voice-play:hover{background:#785014}
[data-narration][data-mode=blocked] .voice-status{color:#7b541c;font-weight:600}
.coach-voice[data-mode=blocked].is-folded{border-color:#c49a53;background:#fff3cf}
.coach-voice[data-mode=blocked] .coach-voice-launcher small{color:#805413;font-weight:700}
.voice-bars{height:12px;display:flex;align-items:center;gap:2px;width:13px;flex-shrink:0}.voice-bars i{height:3px;width:3px;border-radius:2px;background:#7b8d61}.voice-bars i:nth-child(2){height:8px}
[data-mode=playing] .voice-bars i{animation:voice-wave .65s ease-in-out infinite alternate}[data-mode=playing] .voice-bars i:nth-child(2){animation-delay:-.3s}[data-mode=playing] .voice-bars i:nth-child(3){animation-delay:-.5s}
.coach-voice{position:fixed;right:24px;bottom:var(--coach-bottom-offset,24px);width:340px;max-width:calc(100vw - 24px);max-height:calc(100dvh - var(--coach-bottom-offset,24px) - 12px);z-index:180;border:1px solid var(--voice-line);border-radius:20px;background:var(--voice-paper);box-shadow:0 6px 0 #b49c6830,0 16px 48px #493a2026;isolation:isolate}
.coach-voice [hidden]{display:none}
.coach-voice-body{max-height:calc(100dvh - var(--coach-bottom-offset,24px) - 14px);overflow:auto;border-radius:19px;overscroll-behavior:contain}
.coach-voice-head{display:flex;align-items:center;gap:8px;padding:12px 14px 0 8px}
.coach-voice-handle{display:flex;gap:7px;align-items:center;flex:1;min-width:0;padding:0;border:0;background:none;text-align:left;cursor:grab;touch-action:none;user-select:none}
.coach-voice-handle:active{cursor:grabbing}.coach-voice .coach-voice-handle:disabled{opacity:1;cursor:default}
.coach-voice .coach-voice-mascot{width:66px;height:66px;flex-shrink:0;pointer-events:none}
.coach-voice-handle>span:not(.penguin):not(.coach-voice-grip),.coach-voice-launcher>span:not(.penguin){display:flex;flex-direction:column;gap:3px}
.coach-voice-handle strong,.coach-voice-launcher strong{font-size:17px;font-weight:650;letter-spacing:.04em;color:var(--voice-ink)}
.coach-voice-handle small{font-size:10px;letter-spacing:.13em;color:#8c753e;background:#f2e6c7;padding:2px 6px;border-radius:4px;align-self:flex-start}
.coach-voice-grip{margin-left:auto;color:#b09d75;font-size:21px;font-weight:400}
.coach-voice-fold{display:flex;align-items:center;gap:2px;align-self:flex-start;margin-top:3px;padding:6px 3px;border-radius:6px;background:none;color:var(--voice-muted);font-size:11px;min-height:32px}
.coach-voice-fold svg{width:16px;height:16px}.coach-voice-fold:hover{background:#eee4cd}
.coach-voice-content{padding:4px 18px 15px}
.voice-script-label{display:block;font-size:11px;color:var(--voice-muted);letter-spacing:.06em;margin:0 0 7px}
.coach-voice .voice-transcript{font-size:13px;line-height:1.9;font-weight:400;max-height:148px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ceb987 transparent;margin:0 0 12px;padding:10px 12px;color:var(--voice-ink);border:1px solid #eee3cc;background:#fffdf7;border-radius:10px;white-space:pre-wrap;overflow-wrap:anywhere;text-align:left}
.coach-voice-launcher{display:flex;align-items:center;gap:6px;padding:5px 12px 5px 4px;width:100%;background:none;text-align:left;color:var(--voice-ink);border-radius:18px}
.coach-voice-launcher small{font-size:11px;color:var(--voice-muted)}.coach-voice-launcher>svg{width:16px;height:16px;margin-left:8px;color:var(--voice-muted)}
.coach-voice.is-folded{width:176px}.coach-voice.is-folded .coach-voice-mascot{width:55px;height:55px}.coach-voice.is-folded .coach-voice-launcher strong{font-size:14px}
.coach-voice--dialog{z-index:240}
/* Guided lessons already have a movable penguin coach; keep one companion. */
.narration-in-coach{margin:10px 0 0;padding:10px 0 0;border-top:1px solid #e6dfc8}
.narration-in-coach .voice-control-row{gap:6px}.narration-in-coach .voice-caption{font-size:10px;margin-top:5px}
.coach-body>p[data-voice-transcript]{max-height:116px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c3b489 transparent;padding-right:6px;white-space:pre-wrap}
/* Keep the actual form and its floating coach side by side on desktop. */
@media(min-width:1024px){.is-guided .modal-backdrop{place-items:center start;padding-left:max(24px,calc((100vw - 1180px)/2))}.is-guided .business-modal{max-width:calc(100vw - 392px)}}
@media(max-width:1180px){.coach-voice--dialog{position:relative;right:auto;bottom:auto;width:100%;max-width:100%;margin:20px 0 0;box-shadow:0 3px 0 #b49c681f}.coach-voice--dialog.is-folded{width:176px;margin-left:auto}.coach-voice--dialog .coach-voice-grip{display:none}}
@media(max-width:600px){.coach-voice{right:12px;bottom:var(--coach-bottom-offset,12px);width:min(340px,calc(100vw - 24px))}.coach-voice-content{padding:4px 14px 12px}.coach-voice-head{padding:8px 10px 0 6px}.coach-voice .voice-transcript{max-height:132px}.coach-voice .coach-voice-mascot{width:56px;height:56px}.coach-voice--dialog{right:auto;bottom:auto;width:100%}.coach-voice--dialog .coach-voice-content{padding:4px 10px 12px}.coach-voice--dialog .voice-toggle span,.coach-voice--dialog .voice-replay span,.coach-voice--dialog .voice-play span{font-size:11px}.coach-voice--dialog .voice-control-row{gap:5px}.coach-voice--dialog .voice-play{min-width:60px;padding-inline:8px}}
@media(max-height:500px){.coach-voice .voice-transcript{max-height:88px}.coach-voice-head{padding-top:4px}.coach-voice .coach-voice-mascot{width:48px;height:48px}.coach-voice .voice-caption{margin-top:3px}}
.penguin.is-speaking{filter:drop-shadow(0 2px 5px #10947524)}
@keyframes voice-wave{from{transform:scaleY(.5)}to{transform:scaleY(1.5)}}
@media(prefers-reduced-motion:reduce){[data-mode=playing] .voice-bars i{animation:none}}
/* Leave a dedicated lane beside the first teaching target for its readable coach. */
@media(min-width:1024px){.is-guided:has(#floating-coach[data-step="r-intro"]) .shop-introduction{width:calc(100% - 392px)}.is-guided:has(#floating-coach[data-step="r-intro"]) .intro-tool-pair{grid-template-columns:1fr;gap:10px}}
@media(min-width:1024px) and (max-width:1180px){.is-guided:has(#floating-coach[data-step="r-intro"]) .shop-introduction{width:calc(100% - 362px)}}
/* A self-contained learning reward fits a narrow screen; its backdrop needs no desktop-operation note. */
body:has(.coach-voice--dialog) .desktop-note{display:none}
