:root{font-family:Segoe UI,Arial,sans-serif;color:#203e34;background:#f6f3ed;--green:#214c3e;--muted:#718077;--line:#e6e8df}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 10% 15%,#e9eee3 0,transparent 40%),#f6f3ed}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,textarea:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #ad8650;outline-offset:3px}[hidden]{display:none!important}.shell{max-width:1080px;margin:auto;padding:28px 32px}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.brand{font-family:Georgia,serif;color:var(--green);font-size:44px;text-decoration:none;letter-spacing:-2px;line-height:.85}.brand span{display:block;font:9px Segoe UI,sans-serif;letter-spacing:2.6px;margin-top:13px}.version{font-size:11px;border:1px solid #dce0d5;padding:7px 12px;border-radius:20px;color:var(--muted)}.conversation{background:#fffefa;border:1px solid #e4e5da;border-radius:25px;overflow:hidden;box-shadow:0 20px 70px #3242320b}.toolbar{display:flex;align-items:center;justify-content:space-between;padding:20px 25px;border-bottom:1px solid var(--line);gap:15px}.toolbar strong{font-size:15px}.toolbar-note{font-size:12px;color:var(--muted);margin-left:16px}.modes{display:flex;padding:4px;gap:3px;background:#f0f1eb;border-radius:12px}.modes button{border:0;background:transparent;color:#657467;border-radius:9px;padding:9px 20px;font-size:13px}.modes button[aria-pressed=true]{background:var(--green);color:#fff;box-shadow:0 2px 5px #24453420}.messages{min-height:370px;max-height:530px;overflow:auto;padding:30px 38px;scroll-behavior:smooth}.welcome{max-width:640px;margin:28px auto 26px;text-align:center}.eyebrow{font-size:9px;letter-spacing:2.3px;color:#777b66}.welcome h1{font:normal 57px/1.04 Georgia,serif;letter-spacing:-1.7px;margin:22px 0 19px;color:#234334}.welcome>p{font-size:14px;line-height:1.8;color:#697362;max-width:405px;margin:0 auto}.suggestions{display:flex;justify-content:center;gap:10px;margin:28px -10px 0}.suggestions button{background:#fffefa;border:1px solid #dfe3d6;border-radius:10px;padding:13px 14px;font-size:12px;color:#52634f;text-align:left}.suggestions button span{margin-left:10px;color:#70775f}.suggestions button:hover{background:#f0f3e9}.composer-area{padding:0 25px 18px}#status{font-size:12px;min-height:16px;color:var(--muted);margin:8px 8px 12px}.composer{display:flex;align-items:flex-end;gap:8px;padding:9px;border:1px solid #dce2d5;border-radius:15px;background:white}.composer textarea{resize:vertical;max-height:150px;min-height:40px;flex:1;width:100%;border:0;padding:12px;background:transparent;line-height:1.4;color:#274233;font-size:14px}.composer textarea::placeholder{color:#77826f}#send{width:42px;height:42px;border:0;background:var(--green);color:white;border-radius:11px;font-size:24px}#mic{border:1px solid var(--line);border-radius:10px;background:#f4f5ef;padding:11px;font-size:12px}#mic[aria-pressed=true]{background:#e1eddf;border-color:#759775}.footer-line{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding:0 4px;font-size:10px;color:#717c65}.footer-line button{font-size:10px;color:#647157;background:none;border:0}.stage{height:260px;background:#e9ece3;position:relative;border-bottom:1px solid var(--line)}.stage video{height:100%;width:100%;object-fit:contain;display:none}.stage #placeholder{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#65745e}.monogram{font:italic 65px Georgia,serif;color:#486247}#placeholder p{margin:10px 0}#placeholder small{font-size:11px}.voice-panel{display:flex;align-items:center;justify-content:center;gap:18px;padding:22px;background:#f0f3eb;border-bottom:1px solid var(--line)}.voice-panel strong{font-size:13px}.voice-panel p{font-size:12px;color:var(--muted);margin:5px 0 0}.wave{display:flex;align-items:center;gap:4px;height:35px}.wave i{display:block;background:#73916b;width:4px;height:12px;border-radius:3px}.wave i:nth-child(2),.wave i:nth-child(4){height:24px}.wave i:nth-child(3){height:35px}.message{display:flex;gap:13px;margin:0 0 23px;align-items:flex-start}.message .badge{flex-shrink:0;width:30px;height:30px;background:#edf1e6;border-radius:50%;display:grid;place-items:center;font:italic 21px Georgia,serif}.message .body{max-width:87%;min-width:0}.message .label{font-size:10px;color:#68765c;margin:1px 0 7px}.message .text{font-size:14px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}.message.user{justify-content:flex-end}.message.user .body{background:#edf1e7;padding:13px 18px;border-radius:16px 16px 3px 16px}.message.user .label{display:none}.message.user .text{line-height:1.55}.message a{color:#3e6949;text-underline-offset:3px}.products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}.product{border:1px solid #e0e5d7;border-radius:14px;background:white;overflow:hidden}.product-image{height:150px;display:grid;place-items:center;background:#f3f3eb}.product-image img{width:100%;height:100%;object-fit:contain}.product-content{padding:15px}.product-content small{font-size:9px;letter-spacing:1.3px;color:#68765c}.product h3{font:20px Georgia,serif;margin:8px 0}.product p{font-size:12px;color:#657157;line-height:1.6}.product details{font-size:12px;color:#66745f}.product summary{cursor:pointer}.product a{display:inline-block;margin-top:12px;font-size:12px}.bottle{height:105px;width:30px;background:#627b45;border-radius:8px 8px 5px 5px;position:relative;border:1px solid #476032;box-shadow:4px 7px 10px #45503218}.bottle:before{content:'';position:absolute;width:12px;height:26px;top:-20px;left:8px;background:#647845;border-radius:3px 3px 0 0}.bottle:after{content:'S';position:absolute;left:2px;right:2px;top:40px;height:33px;background:#f4eeda;text-align:center;font:20px Georgia,serif;line-height:33px;color:#4e6342}.preview-banner{font-size:11px;padding:10px 25px;background:#fff4db;color:#806c36}.test-settings{font-size:11px;color:#68735d;margin:18px 8px}.test-settings summary{cursor:pointer}.test-controls{display:flex;align-items:center;gap:10px;margin:15px 0}.test-controls input{max-width:220px;border:1px solid #ccd4c5;border-radius:5px;padding:8px}.test-settings button{border:1px solid #ccd4c5;border-radius:5px;padding:8px;background:#fffefa;color:#4a6046}.test-settings pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:200px;overflow:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:650px){.shell{padding:18px 12px}.header{padding:0 8px;margin-bottom:20px}.brand{font-size:38px}.conversation{border-radius:18px}.toolbar{padding:14px}.toolbar-note{display:none}.modes button{padding:9px 13px}.messages{padding:23px 18px;min-height:350px;max-height:55dvh}.welcome{margin:18px 0}.welcome h1{font-size:46px}.eyebrow{font-size:8px;letter-spacing:1.3px}.suggestions{flex-direction:column;margin:22px 0 0;gap:7px}.suggestions button{display:flex;justify-content:space-between}.composer-area{padding:0 12px 14px}.composer textarea{font-size:16px;padding:10px 6px}.footer-line{font-size:9px;gap:5px}.products{grid-template-columns:1fr}.message .body{max-width:92%}.stage{height:220px}.test-controls{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.messages{scroll-behavior:auto}}

.test-access{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 25px;background:#f0f3eb;border-bottom:1px solid var(--line)}.test-access strong{font-size:13px}.test-access p{font-size:12px;color:var(--muted);margin:5px 0}.test-access .test-controls{margin:0}.test-access button{background:var(--green);border:0;color:white;padding:10px 14px;border-radius:8px;font-size:12px}@media(max-width:650px){.test-access{align-items:flex-start;flex-direction:column;padding:16px}.test-access .test-controls{width:100%}.test-access input{flex:1;min-width:0}}

/* Compact, viewport-sized studio. Only the conversation scrolls. */
html,body{height:100%;overflow:hidden}
.shell{width:100%;max-width:1600px;height:100dvh;padding:8px 12px;display:flex;flex-direction:column;gap:6px}
.header{display:none}
.conversation{flex:1;min-height:0;display:flex;flex-direction:column;border-radius:16px}
.toolbar{flex-shrink:0;padding:8px 16px;min-height:50px}
.modes button{padding:7px 16px}
.test-access{flex-shrink:0;padding:8px 16px;gap:10px}
.test-access p{margin:3px 0;font-size:11px}
.test-access .test-controls input{padding:7px}
.test-access button{padding:8px 12px}
.messages{flex:1;min-height:0;max-height:none;overflow:auto;padding:18px 24px;overscroll-behavior:contain}
.welcome{margin:12px auto;max-width:760px}
.welcome h1{font-size:42px;margin:12px 0}
.welcome>p{max-width:540px;line-height:1.6}
.suggestions{margin:17px 0 0}
.composer-area{flex-shrink:0;padding:0 16px 9px}
#status{margin:5px 4px 7px}
.composer{padding:6px}
.composer textarea{resize:none;min-height:38px;max-height:78px;padding:9px;font-size:14px}
.footer-line{margin-top:7px}
.stage{flex-shrink:0;height:clamp(125px,25dvh,220px)}
.voice-panel{flex-shrink:0;padding:10px}
.test-settings{flex-shrink:0;margin:0 6px;font-size:10px;max-height:26dvh;overflow:auto}
.test-settings>p{margin:5px 0}
@media(max-width:650px){.shell{padding:4px;gap:4px}.toolbar{padding:6px 10px}.modes button{padding:7px 12px}.test-access{padding:7px 10px;gap:5px}.test-access>div>p{display:none}.test-access .test-controls{flex-wrap:nowrap}.messages{padding:14px 12px}.welcome{margin:8px auto}.welcome h1{font-size:36px}.welcome>p{font-size:13px}.suggestions{margin-top:13px;gap:5px}.suggestions button{padding:9px 12px}.composer-area{padding:0 8px 7px}.composer textarea{font-size:16px}.stage{height:clamp(115px,23dvh,175px)}.footer-line{font-size:9px}}
.wine-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,190px));gap:12px;margin:14px 0;align-items:stretch}.wine-product-card{border:1px solid #dfdfd4;border-radius:12px;overflow:hidden;background:#fffefa;display:flex;flex-direction:column}.wine-card-media{height:128px;min-height:128px;padding:8px;background:#f5f4f2;display:grid;place-items:center}.wine-card-media img{max-height:112px;max-width:100%;width:auto;object-fit:contain}.wine-card-media span{font-size:11px;color:#746b62;text-align:center}.wine-card-body{padding:10px;display:flex;flex-direction:column;gap:6px;flex:1}.wine-card-merchant{font-size:9px;letter-spacing:.04em;text-transform:uppercase;color:#716c60}.wine-card-title{font:500 15px/1.35 Georgia,serif;margin:0;overflow-wrap:anywhere}.wine-card-price{font-size:12px;font-weight:600}.wine-card-availability,.wine-card-check{font-size:10px;color:#6d7564}.wine-card-button,.sp-wine-details,.sp-heart{display:block;width:100%;padding:7px 8px;font:11px Segoe UI,sans-serif;text-align:center;border:1px solid #c9d4c5;border-radius:7px;background:#f5f7ef;color:#244b3c;text-decoration:none;cursor:pointer}.wine-card-button:first-of-type{margin-top:auto}.wine-card-status{font-size:11px;line-height:1.5;margin:0;overflow-wrap:anywhere}.wine-card-status:empty{display:none}.message.assistant>.body:has(.wine-card-grid){max-width:100%;width:100%}@media(max-width:650px){.wine-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.wine-card-title{font-size:13px}.message:has(.wine-card-grid){gap:6px}.message:has(.wine-card-grid)>.badge{display:none}}
.is-thinking #status::after{content:'';display:inline-block;width:24px;height:8px;margin-left:10px;background:radial-gradient(circle,#42634f 3px,transparent 3.5px) 0 50%/8px 8px repeat-x;animation:sophie-thinking 1s ease-in-out infinite;vertical-align:middle}
@keyframes sophie-thinking{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}
@media(prefers-reduced-motion:reduce){.is-thinking #status::after{animation:none;opacity:1}}
.toolbar>div:first-child{display:flex;align-items:center;gap:9px}.toolbar .version{padding:3px 7px;font-size:11px;letter-spacing:.02em;color:#456049;background:#edf2e7;border-color:#cfdcc8;white-space:nowrap}.toolbar-note{margin-left:0}.thinking-indicator{display:flex;align-items:center;gap:12px;min-height:42px;margin:7px 0;padding:10px 14px;border-radius:11px;background:#e8efdf;color:#254832;font-size:14px;font-weight:600}.thinking-dots{display:flex;align-items:center;gap:5px}.thinking-dots i{width:7px;height:7px;background:#40674c;border-radius:50%;animation:sophie-dot 1.1s ease-in-out infinite}.thinking-dots i:nth-child(2){animation-delay:.16s}.thinking-dots i:nth-child(3){animation-delay:.32s}@keyframes sophie-dot{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}.is-thinking #status::after{display:none}@media(prefers-reduced-motion:reduce){.thinking-dots i{animation:none;opacity:1}}@media(max-width:650px){.toolbar>div:first-child{gap:5px}.toolbar .version{font-size:10px;padding:3px 5px}.modes button{padding:7px 10px}.thinking-indicator{font-size:12px;min-height:36px;margin:5px 0;padding:8px 11px}}

.wine-card-description{font-size:12px;line-height:1.45;margin:0}.wine-card-description summary{cursor:pointer}.wine-card-description p{margin:6px 0 0}

/* 0.28: compact conversation, readable on mobile. */
.message { margin-bottom: 6px; }
.message .text, .message.user .text { line-height: 1; }
.message .label { margin-bottom: 2px; }
.message.user .body { padding: 8px 12px; }
.messages { padding: 16px 20px; }
.products { gap: 10px; margin-top: 10px; }
.product-content { padding: 12px; }
.product-content p { line-height: 1.4; margin: 6px 0; }
@media (max-width: 600px) { .messages { padding: 12px; } .message { margin-bottom: 6px; } }

/* Bottle left, full description right; actions keep their existing order. */
.messages{overflow-x:hidden}
.wine-card-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,285px),1fr));max-width:1080px;gap:10px;margin:8px 0;scroll-margin-top:6px}
.wine-product-card{display:grid;grid-template-columns:88px minmax(0,1fr)}
.wine-card-media{height:100%;min-height:184px;padding:6px}
.wine-card-media img{height:172px;max-height:172px;width:100%;max-width:100%;object-fit:contain}
.wine-card-body{min-width:0;padding:10px;gap:6px}
.wine-card-title{font-size:15px;line-height:1.25}
.wine-card-description{font-size:12px;line-height:1.4;margin:0;overflow-wrap:anywhere}
.wine-card-button,.sp-wine-details,.sp-heart{padding:5px 6px}
.wine-card-actions{display:flex;gap:5px}
.wine-card-actions>*{flex:1;min-width:0}
.wine-card-check,.wine-card-availability{font-size:9px}
.wine-card-status{font-size:10px;line-height:1.3}
@media(max-width:650px){.wine-card-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr))}.wine-product-card{grid-template-columns:76px minmax(0,1fr)}.wine-card-media{min-height:172px}.wine-card-media img{height:160px;max-height:160px}.wine-card-body{padding:8px}.wine-card-title{font-size:14px}}

/* User name and initial, aligned with the right-hand message. */
.message.user .label{display:block;text-align:right;overflow-wrap:anywhere}
.message.user .badge{background:#e5edde;color:var(--green)}

#mic{width:42px;min-width:42px;padding:8px}#mic svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}#mic.mic-on{color:#228044;background:#e9f5eb}#mic.mic-off{color:#c22b39;background:#ffecee}.conversation>.sophie-affiliate-note{padding:0 14px;margin:4px 0;font-size:11px}

.audio-unlock{display:flex;justify-content:center;flex-shrink:0}.audio-unlock:has(button[hidden]){display:none}#enable-audio{display:inline-flex;align-items:center;gap:7px;margin:4px 10px;padding:7px 11px;border:1px solid #c3d4bd;border-radius:9px;background:#edf4e7;color:#214c3e;font-size:12px}#enable-audio svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

#speaker{width:42px;height:42px;flex-shrink:0;display:grid;place-items:center;border:1px solid;border-radius:10px;padding:8px}#speaker svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}#speaker.speaker-on{color:#167537;background:#e9f4ea;border-color:#8eb492}#speaker.speaker-off{color:#b42a35;background:#fff0f1;border-color:#d9999e}

/* The gateway controls visibility of visitor access prompts. */
.test-access[hidden] { display: none !important; }

/* A clearly visible conversation end control on touchscreens and desktop. */
.footer-line { align-items: center; flex-wrap: wrap; gap: 8px; }
.footer-line #stop { min-height: 44px; padding: 10px 16px; border: 1px solid var(--green); border-radius: 9px; background: #edf2e9; color: var(--green); font-size: 14px; font-weight: 600; }
.footer-line #stop:disabled { opacity: .55; }
