:root{color-scheme:light;--ink:#203e39;--muted:#6b7e77;--mint:#b5eed7;--gold:#f7d47b;--blue:#aabdf9;--line:#e2e9e1;--forest:#225b45;--paper:#fffefa;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:radial-gradient(ellipse at 10% 0%,#e3efdf 0,transparent 48%),radial-gradient(ellipse at 90% 90%,#ede7d3 0,transparent 44%),#f1f3eb;min-height:100svh;display:grid;place-items:center;padding:22px}button,input,textarea{font:inherit}button{cursor:pointer}button,a,textarea,input{-webkit-tap-highlight-color:transparent}button:disabled{cursor:wait}button:focus-visible,a:focus-visible,textarea:focus-visible,input:focus-visible{outline:3px solid #5da888;outline-offset:4px}button{color:inherit}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app-shell{width:min(1120px,100%);height:min(960px,calc(100svh - 44px));min-height:620px;display:flex;flex-direction:column;border:1px solid #ffffff;border-radius:30px;background:var(--paper);box-shadow:0 22px 90px #263d2420,0 2px 10px #33422e07;overflow:hidden}.topbar{height:78px;flex:0 0 78px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 32px;border-bottom:1px solid #e8eddf;background:#fffefbe8;position:relative;z-index:2}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-icon{width:42px;height:42px;object-fit:cover;border-radius:14px;box-shadow:0 2px 5px #18392c18}.brand strong{font-size:20px;font-weight:750;letter-spacing:-.65px;display:block}.brand small{font-size:10px;letter-spacing:.3px;display:block;color:#7a8c80;margin-top:2px}.brand-spark{color:#b48a36;font-size:16px;margin-left:6px}.header-actions{display:flex;align-items:center;gap:10px}.icon-button{display:grid;place-items:center;width:36px;height:36px;border:1px solid #dfe7dd;border-radius:50%;background:transparent;color:#668173;transition:background .2s,transform .2s}.icon-button:hover{background:#edf5eb;transform:rotate(-8deg)}.icon-button svg{width:20px;height:20px}.preview-badge{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:650;color:#63766b;border:1px solid #dce5d7;background:#f5f7ef;padding:6px 9px;border-radius:20px;margin-right:8px}.preview-badge>span{width:5px;height:5px;background:#b8954f;border-radius:50%}
.mascot-stage{position:relative;isolation:isolate;flex:0 0 37%;min-height:255px;max-height:345px;overflow:hidden;background:radial-gradient(ellipse at 67% 0%,#fff5d6 0,transparent 56%),linear-gradient(110deg,#f0f3dd,#eef5e5 46%,#e0ecd9);border-bottom:1px solid #dce6d6;transition:flex-basis .6s,min-height .6s}.stage-grain{position:absolute;inset:0;opacity:.28;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 150 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.15' filter='url(%23n)'/%3E%3C/svg%3E");pointer-events:none}.stage-watermark{position:absolute;width:430px;right:-35px;top:5px;opacity:.045;filter:grayscale(1);mix-blend-mode:multiply;pointer-events:none}.stage-copy{position:relative;z-index:2;padding:34px 44px;width:53%;height:100%;display:flex;flex-direction:column;justify-content:center}.eyebrow{font-size:8px;font-weight:800;letter-spacing:1.7px;display:flex;align-items:center;gap:8px;color:#7d8d65;margin-bottom:15px}.tiny-star{font-size:17px;color:#a89952}h1{font-size:clamp(30px,3.8vw,46px);font-weight:620;letter-spacing:-2px;line-height:1.09;margin:0 0 13px}h1 em{font-style:normal;color:#476f49;font-weight:750}.stage-copy p{color:#7a896d;font-size:13px;line-height:1.65;margin:0}.stage-tag{display:inline-flex;align-items:center;gap:7px;font-size:9px;letter-spacing:.1px;color:#637658;margin-top:21px;align-self:flex-start;background:#ffffff69;border:1px solid #cfddc3;padding:7px 10px;border-radius:20px}.stage-tag>span{width:5px;height:5px;border-radius:50%;background:#699b5c}.mascot-scene{position:absolute;z-index:3;width:48%;height:100%;right:2%;top:0}.mascot{position:absolute;height:101%;width:100%;bottom:-7%;display:flex;align-items:flex-end;justify-content:center;transform-origin:50% 90%;animation:robot-breathe 5s ease-in-out infinite}.mascot img{height:100%;width:auto;max-width:100%;object-fit:contain;user-select:none;filter:drop-shadow(0 12px 9px #58613b25)}.robot-bubble{position:absolute;z-index:5;right:5%;top:12%;border:1px solid #ffffff;background:#fffef3de;color:#68735a;box-shadow:0 5px 20px #76825b10;padding:9px 13px;font-size:10px;border-radius:14px 14px 14px 3px;transform:rotate(5deg);animation:bubble-float 4s ease-in-out infinite}.float-spark{position:absolute;color:#acb478}.spark-one{top:32%;left:8%;font-size:30px;animation:twinkle 3s ease-in-out infinite}.spark-two{bottom:25%;right:7%;font-size:21px;animation:twinkle 4s ease-in-out 1s infinite}.stage-caption{position:absolute;bottom:10px;right:24px;font-size:8px;letter-spacing:.5px;color:#8b967c;z-index:4}.stage-caption span{margin-right:5px;color:#b39955}
.shop-front{position:absolute;inset:8% 0 0 48%;opacity:.28;filter:blur(.3px);transform:perspective(600px) rotateY(-12deg);z-index:0}.shop-sign{position:absolute;top:10%;left:6%;width:88%;height:57px;display:flex;align-items:center;justify-content:center;flex-direction:column;border:2px solid #97ad8a;color:#617b58;background:#e8edd9;font-size:31px;font-weight:900;letter-spacing:2px;box-shadow:0 4px #bccaaa}.shop-sign span{font-size:5px;font-weight:600;letter-spacing:3px}.shop-window{position:absolute;left:8%;top:44%;width:51%;height:56%;background:linear-gradient(130deg,#e5f0df44,#aac6bb99);border:4px solid #99b394;border-bottom:0;display:flex;gap:12px;padding:19px}.shop-window i{width:25%;height:58%;border:1px solid #b3b280;border-radius:4px;background:linear-gradient(150deg,#edce7166,#b3d1c6);transform:rotate(-5deg)}.shop-window i:nth-child(2){transform:rotate(7deg);margin-top:12px}.shop-window i:nth-child(3){background:linear-gradient(150deg,#b6c8ee88,#c4d8ac)}.shop-awning{position:absolute;top:35%;left:4%;width:92%;height:32px;background:repeating-linear-gradient(90deg,#9aa773 0 28px,#e0e1bb 28px 56px);border-radius:3px 3px 13px 13px;transform:skewX(-5deg);box-shadow:0 6px 8px #59704a22}.shop-door{position:absolute;top:45%;left:65%;width:28%;height:56%;background:#acbda066;border:4px solid #99b394;border-bottom:0}.shop-door span{position:absolute;top:50%;left:6%;height:27px;width:3px;background:#7a9374}
.chat-panel{display:flex;flex-direction:column;flex:1;min-height:0;background:linear-gradient(165deg,#fffefa,#fcfdf8)}.conversation-heading{flex:0 0 39px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;color:#819184;font-size:9px;letter-spacing:.2px;border-bottom:1px solid #edf0e7}.conversation-heading>span:first-child{font-weight:650;color:#697f6d;display:flex;align-items:center;gap:7px}.online-dot{height:5px;width:5px;border-radius:50%;background:#83a877}.conversation-note{font-size:9px}.chat-log{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:18px 35px 12px;display:flex;flex-direction:column;gap:20px;scrollbar-width:thin;scrollbar-color:#d3decc transparent;scroll-behavior:smooth}.day-divider{font-size:8px;letter-spacing:.4px;color:#9aa28e;text-align:center;display:flex;align-items:center;gap:15px;margin:0 0 3px}.day-divider:before,.day-divider:after{content:"";height:1px;background:#eef0e6;flex:1}.message{display:flex;gap:11px;align-items:flex-start;animation:message-in .35s ease-out}.message-avatar{border-radius:13px;flex:0 0 35px;width:35px;height:35px;box-shadow:0 2px 8px #a99a6f18}.message-content{max-width:min(660px,83%);min-width:0}.message-meta{font-size:9px;font-weight:750;color:#536b55;margin:0 0 7px 2px}.message-meta span{font-weight:400;font-size:8px;color:#9ba791;margin-left:7px}.message-bubble{background:#f0f4e9;border:1px solid #e4ead9;border-radius:2px 18px 18px 18px;padding:13px 17px}.message-bubble p{font-size:12px;line-height:1.8;margin:0;white-space:pre-line;overflow-wrap:anywhere;color:#50644d}.message.user{justify-content:flex-end}.message.user .message-content{max-width:80%}.message.user .message-meta{text-align:right;font-weight:500;color:#8c937b}.message.user .message-bubble{background:#e4efdf;border:1px solid #d4e3cb;border-radius:18px 2px 18px 18px}.message.user .message-bubble p{color:#35563a}.message.error .message-bubble{background:#fff1e1;border-color:#edddc8}.message.error .message-bubble p{color:#8b6038}.message-source{font-size:8px;color:#97a18b;margin:5px 2px 0}.suggestions{display:flex;align-items:center;gap:7px;flex:0 0 auto;padding:12px 35px 15px;overflow-x:auto;scrollbar-width:none}.suggestions::-webkit-scrollbar{display:none}.suggestions button{flex:0 0 auto;font-size:9px;padding:8px 12px;border-radius:30px;border:1px solid #dde6d7;background:#fffef9;color:#6b7b60;white-space:nowrap;transition:background .2s,transform .2s,border-color .2s}.suggestions button span{font-size:13px;margin-right:5px;color:#a59c60}.suggestions button:hover{background:#f1f6e8;border-color:#aabd9d;transform:translateY(-2px)}.suggestions button:disabled{opacity:.5}.composer{flex:0 0 auto;padding:0 28px 17px;background:#fffefa}.input-wrap{display:flex;align-items:center;gap:10px;border:1px solid #dae3d1;border-radius:20px;background:#f7f8ef;padding:9px 9px 9px 16px;box-shadow:0 3px 10px #d5dfc50d;transition:border-color .2s,box-shadow .2s}.input-wrap:focus-within{border-color:#91ac83;box-shadow:0 0 0 3px #e5efde}.composer-spark{color:#b8b585;font-size:19px;padding:3px}.composer textarea{width:100%;resize:none;min-height:24px;max-height:90px;outline:none!important;border:0;background:transparent;font-size:12px;line-height:1.6;padding:5px 0;color:#344b37;scrollbar-width:thin}.composer textarea::placeholder{color:#9aa68d}.send-button{background:var(--forest);color:#f2f9e8;border:0;flex:0 0 40px;width:40px;height:40px;border-radius:13px;display:grid;place-items:center;box-shadow:0 3px 7px #264f3420;transition:transform .2s,background .2s}.send-button svg{width:19px;height:19px;transform:rotate(-25deg)}.send-button:hover{background:#397259;transform:translateY(-1px)}.send-button:disabled{opacity:.4;transform:none}.composer-footer{display:flex;align-items:center;gap:14px;justify-content:space-between;font-size:8px;color:#a0aa93;padding:9px 7px 0}.character-count{margin-left:auto;color:#a6b29c;font-variant-numeric:tabular-nums}.text-button{border:0;background:transparent;padding:0;font-size:8px;color:#819474;text-decoration:underline;text-underline-offset:3px}.activity-bar{font-size:10px;padding:2px 35px 10px;color:#8a9c78;display:flex;align-items:center;gap:8px}.thinking-dots{display:inline-flex;gap:3px;align-items:center}.thinking-dots i{width:4px;height:4px;background:#9cb78c;border-radius:50%;animation:dot-bounce 1s ease-in-out infinite}.thinking-dots i:nth-child(2){animation-delay:.15s}.thinking-dots i:nth-child(3){animation-delay:.3s}
.info-dialog{width:min(420px,calc(100vw - 32px));padding:35px;border:1px solid #dce5d3;border-radius:25px;background:#fffef8;color:#38503e;box-shadow:0 20px 120px #21322255}.info-dialog::backdrop{background:#283b3359;backdrop-filter:blur(5px)}.dialog-close{position:absolute;right:15px;top:15px;font-size:25px}.dialog-eyebrow{display:block;letter-spacing:1.5px;font-size:8px;color:#a0a677;margin:12px 0}.info-dialog h2{font-size:25px;letter-spacing:-1px;margin:0 0 20px}.info-dialog p{font-size:12px;line-height:1.8;color:#7a8871}.dialog-limit{padding:13px;border-radius:12px;background:#eef2e4;font-size:10px;line-height:1.7;color:#758268;margin:20px 0}.primary-button{width:100%;padding:13px 20px;border:0;border-radius:12px;color:#f7f9ec;background:var(--forest);font-size:12px;font-weight:650}.access-dialog{text-align:center}.access-dialog img{border-radius:18px}.access-dialog input{display:block;width:100%;padding:13px;border-radius:11px;border:1px solid #cad9bf;background:#f7faef;color:#365540;margin:8px 0 15px}.access-dialog label{display:block;text-align:left;font-size:10px;color:#819374}.access-dialog #access-error{color:#9e5b33;font-size:11px;min-height:18px}.access-dialog form{margin-top:25px}
.celebration{position:absolute;inset:0;pointer-events:none}.celebration i{position:absolute;font-style:normal;opacity:0;color:#c3a151;left:44%;top:45%;font-size:22px}.celebration i:nth-child(2){left:30%;color:#83a99a}.celebration i:nth-child(3){left:65%;color:#9eafda}.celebration i:nth-child(4){left:22%;color:#c9b56c}.celebration i:nth-child(5){left:75%;color:#a3b87c}.mascot-stage[data-mood="celebrate"] .celebration i{animation:confetti .9s ease-out forwards}.mascot-stage[data-mood="celebrate"] .celebration i:nth-child(2n){animation-delay:.12s}.mascot-stage[data-mood="celebrate"] .mascot{animation:happy-hop .8s ease-in-out 2}.mascot-stage[data-mood="thinking"] .mascot{animation:robot-think 2s ease-in-out infinite}.mascot-stage[data-mood="wave"] .mascot{animation:robot-greet 1s ease-in-out 2}.motion-paused *{animation-play-state:paused!important;scroll-behavior:auto!important}.motion-paused .mascot img{visibility:hidden}.motion-paused .mascot{background:url('/assets/avatar.svg') center 58%/auto 65% no-repeat}
@keyframes robot-breathe{50%{transform:translateY(-4px) rotate(.7deg)}}@keyframes robot-think{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg) translateY(-4px)}}@keyframes robot-greet{0%,100%{transform:rotate(0)}30%{transform:rotate(-4deg)}70%{transform:rotate(4deg)}}@keyframes happy-hop{0%,100%{transform:translateY(0)}35%{transform:translateY(-13px) rotate(-3deg)}65%{transform:translateY(-7px) rotate(3deg)}}@keyframes bubble-float{50%{transform:translateY(-4px) rotate(3deg)}}@keyframes twinkle{50%{opacity:.35;transform:scale(.7) rotate(20deg)}}@keyframes message-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes dot-bounce{50%{transform:translateY(-3px);opacity:.4}}@keyframes confetti{0%{opacity:0;transform:translateY(0) scale(.3)}25%{opacity:1}100%{opacity:0;transform:translateY(-90px) rotate(100deg) scale(1.2)}}
@media(min-width:1400px){.app-shell{max-height:1000px}.message-bubble p{font-size:14px}.message-meta{font-size:10px}.composer textarea{font-size:14px}.suggestions button{font-size:10px}.composer-footer{font-size:9px}.text-button{font-size:9px}.chat-log{padding-top:24px}.message-bubble{padding:15px 20px}}
@media(max-width:800px){body{padding:14px}.app-shell{height:calc(100svh - 28px);border-radius:24px;min-height:560px}.topbar{padding:0 22px;height:70px;flex-basis:70px}.stage-copy{padding-left:28px;width:57%}h1{font-size:35px}.eyebrow{font-size:7px;letter-spacing:1px}.mascot-scene{right:0;width:50%}.robot-bubble{font-size:9px;right:3%;padding:7px 10px}.mascot-stage{min-height:240px;flex-basis:36%}.stage-tag{font-size:8px}.chat-log{padding:17px 23px 10px}.conversation-heading{padding:0 24px}.suggestions{padding:10px 23px 13px;gap:6px}.composer{padding:0 20px 14px}.message-bubble p{font-size:13px}.composer textarea{font-size:13px}.preview-badge{font-size:9px;margin-right:0}.header-actions{gap:7px}.brand strong{font-size:19px}}
@media(max-width:540px){body{padding:0;background:#fffefa;display:block}.app-shell{width:100%;height:100svh;min-height:520px;max-height:none;border:0;border-radius:0;box-shadow:none}.topbar{height:66px;flex-basis:66px;padding:0 18px;gap:8px}.brand{gap:9px}.brand-icon{height:34px;width:34px;border-radius:11px}.brand strong{font-size:17px;letter-spacing:-.55px}.brand small{font-size:8px;letter-spacing:0}.brand-spark{font-size:12px;margin-left:4px}.icon-button{width:31px;height:31px}.icon-button svg{width:17px;height:17px}.header-actions{gap:7px}.preview-badge{font-size:0;padding:5px;border:0;background:none;margin-right:0}.preview-badge>span{width:6px;height:6px}.mascot-stage{flex-basis:34%;min-height:210px;max-height:290px}.stage-copy{width:58%;padding:20px 0 20px 22px;justify-content:center}h1{font-size:29px;letter-spacing:-1.4px;margin-bottom:10px}.eyebrow{font-size:6px;letter-spacing:.7px;max-width:150px;line-height:1.6;gap:5px;margin-bottom:10px}.tiny-star{font-size:13px}.stage-copy p{font-size:11px;line-height:1.55;max-width:160px}.desktop-break{display:none}.stage-tag{font-size:7px;padding:5px 7px;margin-top:13px;gap:5px}.stage-tag>span{width:4px;height:4px}.mascot-scene{width:57%;right:-6%;top:4%;height:100%}.mascot{width:100%;height:97%;bottom:-1%;max-width:none}.mascot img{max-width:115%}.robot-bubble{top:9%;right:8%;max-width:126px;line-height:1.5;font-size:8px;padding:6px 9px;transform:rotate(5deg);border-radius:10px 10px 10px 1px}.spark-one{left:4%;top:27%;font-size:20px}.spark-two{font-size:13px;right:12%;bottom:19%}.stage-caption{font-size:6px;bottom:7px;right:13px}.shop-front{inset:12% -20% 0 45%;opacity:.2}.stage-watermark{width:300px;right:-70px;top:20px;opacity:.04}.shop-sign{font-size:20px;height:39px}.shop-sign span{font-size:3px}.conversation-heading{padding:0 19px;flex-basis:34px;font-size:8px}.conversation-note{font-size:8px}.chat-log{padding:13px 17px 8px;gap:16px}.day-divider{font-size:7px;gap:10px}.message{gap:8px}.message-avatar{width:30px;height:30px;flex-basis:30px;border-radius:10px}.message-content{max-width:calc(100% - 39px)}.message-meta{font-size:9px;margin-bottom:6px}.message-meta span{font-size:7px;margin-left:5px}.message-bubble{padding:11px 13px;border-radius:2px 15px 15px 15px}.message-bubble p{font-size:12px;line-height:1.75}.message-source{font-size:7px}.suggestions{padding:9px 17px 12px;gap:6px;mask-image:linear-gradient(to right,#000 90%,transparent)}.suggestions button{font-size:8px;padding:7px 10px}.suggestions button span{font-size:11px}.composer{padding:0 12px max(12px,env(safe-area-inset-bottom))}.input-wrap{border-radius:17px;gap:7px;padding:7px 7px 7px 12px}.composer-spark{font-size:15px}.composer textarea{font-size:16px;line-height:1.5;min-height:26px;padding:6px 0}.composer textarea::placeholder{font-size:12px}.send-button{height:37px;width:37px;flex-basis:37px;border-radius:12px}.composer-footer{font-size:7px;padding:7px 4px 0;gap:8px}.text-button{font-size:7px}.character-count{display:none}.activity-bar{font-size:9px;padding:1px 18px 8px}.has-messages .mascot-stage{flex-basis:25%;min-height:175px}.has-messages .stage-copy{padding-block:15px}.has-messages h1{font-size:25px}.has-messages .stage-tag{display:none}.has-messages .eyebrow{margin-bottom:7px}.has-messages .mascot-scene{right:-3%;width:48%}.has-messages .robot-bubble{display:none}.has-messages .stage-caption{display:none}.info-dialog{padding:28px}.info-dialog h2{font-size:23px}}
@media(max-height:650px) and (min-width:541px){body{padding:8px}.app-shell{height:calc(100svh - 16px);min-height:450px;border-radius:20px}.topbar{height:58px;flex-basis:58px}.mascot-stage{flex-basis:30%;min-height:160px}.stage-copy{padding-block:15px}h1{font-size:30px}.stage-tag{display:none}.stage-copy p{font-size:11px}.eyebrow{font-size:7px;margin-bottom:8px}.suggestions{padding-block:7px}.composer{padding-bottom:10px}.conversation-heading{flex-basis:29px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Keep answers comfortably readable, including smaller phones. */
.message-bubble p{font-size:14px;line-height:1.7}
.composer textarea{font-size:14px}
.message-meta{font-size:10px}
.message-source{font-size:9px}
.suggestions button{font-size:11px}
.composer-footer,.text-button{font-size:10px}
.conversation-heading,.conversation-note{font-size:10px}
.composer textarea{scrollbar-width:thin}
@media(min-width:541px) and (min-height:651px){.has-messages .mascot-stage{flex-basis:30%;min-height:210px}.has-messages .stage-copy{padding-block:20px}.has-messages .stage-tag{margin-top:13px}}
@media(max-width:540px){.message-bubble p{font-size:13px}.message-meta{font-size:9px}.message-source{font-size:8px}.composer textarea{font-size:16px}.suggestions button{font-size:10px}.composer-footer,.text-button{font-size:8px}.conversation-heading,.conversation-note{font-size:8px}}

.brand strong{font-size:21px}.brand small{font-size:12px}
.day-divider{font-size:11px;letter-spacing:0;margin-bottom:7px;color:#76846f}
.day-divider time{white-space:nowrap}
.conversation-heading #chat-start-date{font-size:11px;white-space:nowrap;color:#76846f}
.message-meta.welcome-meta{font-size:14px;line-height:1.4;display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 9px}
.message-meta.welcome-meta span{font-size:12px;margin-left:0;color:#71816b}
.message-details{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 10px;margin:6px 2px 0}
.message-details .message-source{margin:0;font-size:9px}
.message-time{font-size:10px;line-height:1.5;color:#7a8974;margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}
@media(max-width:540px){.brand strong{font-size:19px}.brand small{font-size:10px}.day-divider{font-size:10px}.message-meta.welcome-meta{font-size:13px}.message-meta.welcome-meta span{font-size:11px}.message-details .message-source{font-size:8px}}
@media(max-width:540px){.conversation-heading #chat-start-date{font-size:10px}}

/* PokéXperto's own rounded silhouette, with a single clear shop name. */
.mascot-halo{position:absolute;width:73%;height:74%;left:16%;bottom:0;border-radius:48% 48% 26% 26%;background:radial-gradient(ellipse at 50% 30%,#fbfff0bb,#c9e9d299 75%);border:1px solid #f8fff2cc;transform:rotate(-5deg);box-shadow:inset 0 0 45px #e9f7db99}
.mascot-halo:before,.mascot-halo:after{content:"";position:absolute;width:37px;height:52px;border:1px solid #9fbea277;border-radius:7px;transform:rotate(-18deg);left:-4%;top:43%}
.mascot-halo:after{width:26px;height:37px;left:auto;right:-3%;top:59%;transform:rotate(16deg);border-color:#cfb97488}
.mascot-brand{position:absolute;z-index:4;top:15px;left:8%;right:5%;text-align:center;font-size:25px;font-weight:800;letter-spacing:-1px;line-height:1.2;color:#39674f;text-shadow:0 1px #fff9}
.mascot-brand span{display:block;font-size:7px;letter-spacing:1.6px;font-weight:600;color:#7b9572;margin-top:5px}
.mascot{height:86%;bottom:-2%}
.mascot img{filter:drop-shadow(0 8px 6px #4d796625)}
.mascot .mascot-static{display:none}
.robot-bubble{top:33%;left:0;right:auto;max-width:145px;background:#fffef4ee;transform:rotate(-4deg);font-size:9px}
.stage-caption{display:none}
.motion-paused .mascot{background:none}
.motion-paused .mascot .mascot-animated{display:none}
.motion-paused .mascot .mascot-static{display:block;visibility:visible}
.message-avatar{background:#eaf4e6;box-shadow:0 2px 8px #619f7f14}
@media(max-width:800px){.mascot-brand{font-size:23px;top:16px}.mascot-brand span{font-size:6px;letter-spacing:1px}.robot-bubble{left:-2%;max-width:120px;font-size:8px}}
@media(max-width:540px){.mascot-scene{right:-2%;top:0;width:52%}.mascot-brand{top:17px;left:0;right:0;font-size:20px;letter-spacing:-.8px}.mascot-brand span{font-size:5px;letter-spacing:.65px;margin-top:4px}.mascot{height:83%;bottom:-3%}.mascot-halo{width:87%;left:6%;height:72%;bottom:2%}.robot-bubble{display:none}.has-messages .mascot-scene{right:0;width:46%}.has-messages .mascot-brand{font-size:17px;top:10px}.has-messages .mascot-brand span{font-size:4.5px;letter-spacing:.4px}.has-messages .mascot{height:82%;bottom:-1%}}

/* The illustrated brothers share a shop scene; only their greeting hands move. */
.stage-copy{width:45%;z-index:4}
.mascot-scene{width:56%;right:0;top:0;height:100%;container-type:size}
.trainer-shop{position:absolute;inset:0 0 0 -16%;width:116%;height:100%;object-fit:cover;object-position:center 43%;opacity:.66;filter:saturate(.8);mask-image:linear-gradient(90deg,transparent,#000 26%)}
.mascot-scene:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#eef4e234,transparent 35%),linear-gradient(0deg,#dcebd655,transparent 45%)}
.mascot-brand{z-index:3;left:18%;right:8%;top:13px;color:#fff5d6;text-shadow:0 2px 8px #123c45b3;font-size:25px;letter-spacing:-.7px}
.mascot-brand span{color:#f5f4d9;font-size:6px;letter-spacing:1.7px;text-shadow:0 1px 5px #173f46;margin-top:4px}
.mascot-stage[data-mood] .mascot{animation:none;transform:none}
.mascot.trainer-team{z-index:2;left:50%;right:auto;top:auto;bottom:0;width:min(96%,133cqh);height:auto;aspect-ratio:1591 / 989;translate:-50% 0;filter:drop-shadow(0 5px 8px #153f4326);display:block}
.mascot .trainer-layer{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:fill;filter:none;visibility:visible;user-select:none;pointer-events:none}
.mascot .mascot-static{display:none}
.trainer-hand-cap{transform-origin:8% 62%;animation:trainer-wave-cap 15s ease-in-out infinite}
.trainer-hand-hair{transform-origin:92% 62%;animation:trainer-wave-hair 17s ease-in-out 3s infinite}
.robot-bubble{z-index:5;top:17%;left:-6%;right:auto;padding:7px 10px;max-width:140px;font-size:9px;transform:rotate(-3deg);box-shadow:0 3px 15px #29473a12}
.mascot-stage[data-mood="idle"] .robot-bubble{opacity:0}
.message-avatar{width:38px;height:38px;flex-basis:38px;object-fit:contain;border-radius:50%;background:#e4efe1;border:1px solid #d9e5d4;box-shadow:0 2px 5px #375f3b0d}
.motion-paused .mascot .mascot-animated{display:none}
.motion-paused .mascot .mascot-static{display:block;visibility:visible}
@keyframes trainer-wave-cap{0%,3%,18%,100%{transform:rotate(0)}6%,12%{transform:rotate(-8deg)}9%,15%{transform:rotate(7deg)}}
@keyframes trainer-wave-hair{0%,3%,16%,100%{transform:rotate(0)}5%,10%{transform:rotate(8deg)}7.5%,12.5%{transform:rotate(-7deg)}}
@media(max-width:800px){.stage-copy{width:45%;padding-left:28px}.mascot-scene{width:57%;right:0}.mascot-brand{font-size:23px;left:15%;top:13px}.robot-bubble{max-width:120px;font-size:8px;top:22%}}
@media(max-width:540px){
  .stage-copy{width:48%;padding-left:20px;padding-top:18px;justify-content:flex-start}
  .stage-copy h1{font-size:28px;letter-spacing:-1.4px}
  .stage-copy p{font-size:11px;max-width:115px}
  .stage-copy .eyebrow{font-size:6px;max-width:155px;margin-bottom:12px}
  .stage-tag{display:none}
  .mascot-scene{width:59%;right:0;top:0;height:100%}
  .trainer-shop{inset:0 0 0 -10%;width:110%;opacity:.55;object-position:65% center;mask-image:linear-gradient(90deg,transparent,#000 25%)}
  .mascot-brand{left:26%;right:4%;top:19px;font-size:20px;letter-spacing:-.8px}
  .mascot-brand span{font-size:4px;letter-spacing:.5px;margin-top:3px}
  .mascot.trainer-team{width:108%;height:auto;bottom:0;left:43%}
  .robot-bubble{display:none}
  .has-messages .mascot-scene{width:59%;right:0}
  .has-messages .mascot.trainer-team{height:auto;bottom:0;width:min(108%,144cqh)}
  .has-messages .mascot-brand{font-size:18px;top:10px}
  .has-messages .mascot-brand span{font-size:4px;letter-spacing:.4px}
  .has-messages .stage-copy{padding-top:14px}
  .has-messages .stage-copy h1{font-size:25px}
  .message-avatar{width:33px;height:33px;flex-basis:33px}
}
@media(prefers-reduced-motion:reduce){.mascot .mascot-animated{display:none}.mascot .mascot-static{display:block;visibility:visible}}

/* Removing entry animations keeps new messages visible while motion is off. */
.motion-paused *{animation:none!important;scroll-behavior:auto!important}
.icon-button:disabled{cursor:default;opacity:.55}
@media(max-width:360px){
  .mascot-stage{min-height:180px;flex-basis:31%}
  .stage-copy h1,.has-messages .stage-copy h1{font-size:22px;letter-spacing:-1.2px}
  .stage-copy p{max-width:92px;font-size:10px;line-height:1.55}
  .mascot.trainer-team,.has-messages .mascot.trainer-team{width:min(100%,144cqh);left:46%}
}

/* Readable from a little farther away, while keeping the light shop palette. */
:root{font-family:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;--muted:#53634f}
.brand small{color:#53634f;font-size:13px;font-weight:500}
.icon-button{color:#425f4e;border-color:#c6d3bf}
.preview-badge{font-size:11px;color:#475d48;border-color:#c6d3bf}
h1 em{color:#315c3d}
.eyebrow,.stage-copy .eyebrow{font-size:10px;color:#506147;letter-spacing:1px}
.stage-copy p{color:#46593f;font-size:15px;font-weight:450}
.stage-tag{font-size:11px;color:#46593f;border-color:#becdb1}
.conversation-heading{font-size:12px;gap:6px 12px;flex-wrap:wrap;flex-basis:auto;min-height:40px;padding-block:8px;color:#53634f}
.conversation-heading>span:first-child{color:#3d5743}
.conversation-heading #chat-start-date{font-size:12px;color:#53634f}
.day-divider{font-size:12px;color:#53634f}
.message-bubble{background:#edf2e7;border-color:#cddac5}
.message-bubble p{font-size:16px;line-height:1.65;font-weight:450;color:#233b30;letter-spacing:.005em}
.message.user .message-bubble{background:#dfecd9;border-color:#b7cbb0}
.message.user .message-bubble p{color:#1c3d2a}
.message-meta,.message.user .message-meta{font-size:13px;color:#3d543b;font-weight:650}
.message-meta.welcome-meta{font-size:16px;color:#344e36}
.message-meta.welcome-meta span{font-size:13px;color:#53634f;font-weight:500}
.message-details .message-source,.message-time{font-size:12px;color:#53634f}
.message.error .message-bubble p{color:#75491f}
.suggestions button{font-size:13px;font-weight:550;color:#3f5539;border-color:#c4d1ba;padding:9px 13px}
.suggestions button span{color:#73632d}
.composer textarea{font-size:16px;line-height:1.6;font-weight:450;color:#233b30}
.composer textarea::placeholder{font-size:15px;color:#596a54;opacity:1}
.input-wrap{background:#f3f5eb;border-color:#bdccb2}
.composer-footer,.text-button{font-size:11px;color:#53634f;font-weight:500}
.composer-footer{flex-wrap:wrap;gap:5px 14px}
.composer-footer>span:first-child{flex:1 1 230px}
.character-count{color:#53634f}
.activity-bar{font-size:13px;color:#465c3c}
.info-dialog p{font-size:15px;line-height:1.7;color:#46593f}
.dialog-eyebrow{font-size:11px;color:#53634f}
.dialog-limit{font-size:13px;color:#46593f}
.primary-button{font-size:15px}
.access-dialog label{font-size:13px;color:#46593f}
.access-dialog input{font-size:16px}
.access-dialog #access-error{font-size:13px;color:#87471d}
@media(max-width:540px){
  .brand small{font-size:11px}
  .preview-badge{font-size:0}
  .stage-copy .eyebrow{font-size:9px;letter-spacing:.65px}
  .stage-copy p{font-size:12px;line-height:1.6}
  .message-bubble p{font-size:15px;line-height:1.6}
  .message-meta,.message.user .message-meta{font-size:12px}
  .message-meta.welcome-meta{font-size:15px}
  .message-meta.welcome-meta span{font-size:12px}
  .message-details .message-source,.message-time{font-size:12px}
  .suggestions button{font-size:12px;padding:8px 11px}
  .composer textarea{font-size:16px}
  .composer textarea::placeholder{font-size:15px}
  .composer-footer{gap:5px 10px}
  .composer-footer>span:first-child{flex-basis:220px}
  .activity-bar{font-size:12px}
}
@media(max-width:360px){
  .stage-copy .eyebrow{display:none}
  .stage-copy p{font-size:12px}
  .conversation-heading{column-gap:8px}
  .composer-footer>span:first-child{flex-basis:210px}
}
@media(max-width:540px) and (max-height:680px){
  .mascot-stage,.has-messages .mascot-stage{flex-basis:140px;min-height:140px;max-height:140px}
  .stage-copy,.has-messages .stage-copy{justify-content:center;padding-block:12px}
  .stage-copy .eyebrow,.stage-copy p{display:none}
  .stage-copy h1,.has-messages .stage-copy h1{font-size:24px;margin-bottom:0}
  .mascot-brand,.has-messages .mascot-brand{top:8px;font-size:17px}
  .mascot.trainer-team,.has-messages .mascot.trainer-team{width:min(94%,110cqh);left:51%}
}
@media(min-width:541px) and (max-height:780px){
  .mascot-stage,.has-messages .mascot-stage{flex-basis:27%;min-height:160px;max-height:210px}
  .stage-copy,.has-messages .stage-copy{padding-block:14px}
  .stage-copy .eyebrow,.stage-tag{display:none}
  .stage-copy h1{font-size:32px}
  .stage-copy p{font-size:14px}
  .mascot-brand{font-size:20px;top:8px}
  .mascot.trainer-team{width:min(90%,110cqh)}
}

/* Keep the full conversation inside one scrollable area. */
html,body{height:100%;overflow:hidden}
body{min-height:0;height:100svh;height:100dvh}
.app-shell{height:calc(100svh - 44px);height:calc(100dvh - 44px);min-height:0;max-height:none}
.brand>span,.header-actions,.chat-panel,.input-wrap{min-width:0}
.header-actions{flex-shrink:0}
.chat-panel{overflow:hidden}
.chat-log{overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;scroll-behavior:auto}
.chat-log>*,.message,.day-divider{flex-shrink:0}
.message-content{overflow-wrap:anywhere}
.composer{flex-shrink:0;margin-top:auto;position:relative;z-index:2}
.composer textarea{min-width:0}
.activity-bar{flex-shrink:0}

/* Once a conversation starts, the greeting becomes a compact header. */
.has-messages .mascot-stage{flex:0 0 80px;min-height:80px;max-height:80px}
.has-messages .stage-copy{width:65%;padding:8px 32px;justify-content:center}
.has-messages .stage-copy h1{font-size:26px;line-height:1.12;letter-spacing:-1px;margin:0}
.has-messages .stage-copy .eyebrow,
.has-messages .stage-copy p,
.has-messages .stage-tag,
.has-messages .mascot-brand,
.has-messages .robot-bubble,
.has-messages .stage-caption,
.has-messages .celebration{display:none}
.has-messages .mascot-scene{top:0;right:0;width:35%;height:100%}
.has-messages .trainer-shop{inset:0;width:100%;object-position:center 43%}
.has-messages .mascot.trainer-team{width:min(96%,150cqh);height:auto;left:50%;bottom:0}
.has-messages .suggestions{display:none}
.has-messages .composer{padding:0 24px 8px}
.has-messages .input-wrap{min-height:54px;padding:4px 6px 4px 12px}
.has-messages .composer textarea{min-height:44px;max-height:72px;padding:6px 0;line-height:1.5}
.has-messages .send-button{width:44px;height:44px;flex-basis:44px}
.has-messages .composer-footer{padding-top:5px;gap:4px 10px;line-height:1.35}

/* A requested transcript stays available in its message bubble. */
.transcript-download{display:inline-flex;align-items:center;max-width:100%;min-height:44px;margin-top:12px;padding:10px 13px;border:1px solid #aac5ac;border-radius:12px;background:#fffefa;color:#225b45;font-size:16px;font-weight:650;line-height:1.45;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.transcript-download:hover{background:#e0eddc;border-color:#789d7e}
.transcript-download:focus-visible{outline-offset:3px}

@media(max-width:800px){
  .app-shell{height:calc(100svh - 28px);height:calc(100dvh - 28px)}
  .has-messages .stage-copy{padding-left:24px}
}
@media(max-height:780px) and (min-width:541px){
  body{padding:14px}
  .app-shell{height:calc(100svh - 28px);height:calc(100dvh - 28px)}
}
@media(max-height:650px) and (min-width:541px){
  body{padding:8px}
  .app-shell{height:calc(100svh - 16px);height:calc(100dvh - 16px)}
}
@media(max-width:540px){
  .app-shell{height:100svh;height:100dvh;min-height:0}
  .has-messages .mascot-stage{flex-basis:76px;min-height:76px;max-height:76px}
  .has-messages .stage-copy{width:58%;padding:8px 8px 8px 20px}
  .has-messages .stage-copy h1{font-size:22px;line-height:1.14;letter-spacing:-.8px}
  .has-messages .mascot-scene{width:42%;right:0}
  .has-messages .mascot.trainer-team{width:min(98%,145cqh);left:50%}
  .has-messages .composer{padding:0 12px max(8px,env(safe-area-inset-bottom))}
  .transcript-download{font-size:15px}
}
@media(max-width:360px){
  .topbar{padding-inline:12px}
  .brand small{max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .has-messages .stage-copy{padding-left:16px}
}
@media(max-width:540px) and (max-height:480px){
  .has-messages .topbar{height:52px;flex-basis:52px}
  .has-messages .mascot-stage{flex-basis:56px;min-height:56px;max-height:56px}
  .has-messages .stage-copy{padding-block:5px}
  .has-messages .stage-copy h1{font-size:20px;line-height:1.1}
  .has-messages .conversation-heading{min-height:32px;padding-block:4px}
  .has-messages .composer{padding-bottom:max(5px,env(safe-area-inset-bottom))}
}

/* Legal information stays reachable without replacing or resetting the chat. */
.footer-links{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:0 14px;flex-shrink:0}
.footer-links a,.footer-links .text-button{display:inline-flex;align-items:center;min-height:28px;padding:3px 0;color:#3e5946;font-size:12px;line-height:1.4;font-weight:550;text-decoration:underline;text-underline-offset:3px}
.footer-links a:hover,.footer-links .text-button:hover{color:#173e2e}
.character-count{white-space:nowrap}
.access-legal-links{justify-content:center;margin-top:12px}
.inline-privacy-link{color:#285f48;font-weight:550;text-decoration:underline;text-underline-offset:3px}
.microphone-button{border:0;background:transparent;color:#41634d;display:grid;place-items:center;flex:0 0 40px;width:40px;min-height:44px;padding:8px;border-radius:12px}
.microphone-button svg{width:23px;height:23px}
.microphone-button:hover{background:#e2ebdc}
.microphone-button:disabled{opacity:.45;cursor:default}
.microphone-button.is-recording{background:#a43836;color:white;box-shadow:0 0 0 3px #f1dad3}
.audio-enabled{background:#285f48!important;color:white!important;border-color:#285f48!important}
.voice-status{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 7px 9px;font-size:12px;line-height:1.5;color:#34583d}
.voice-status.voice-error{color:#88432b}
.voice-status button{border:1px solid #bacbb1;border-radius:8px;background:#f8faf3;min-height:32px;padding:4px 8px;font-size:12px;color:#294f37;flex-shrink:0}
.speech-choice{display:flex;gap:12px;align-items:flex-start;border:1px solid #c5d2bc;padding:13px;border-radius:12px;color:#344b36;font-size:14px;line-height:1.6;background:#f4f7ee}
.speech-choice input{margin-top:5px;accent-color:#285f48;flex-shrink:0;width:18px;height:18px}
.speech-dialog .speech-note{font-size:13px}
.speech-dialog a{color:#285f48;text-underline-offset:3px}
.speech-dialog-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}
.speech-dialog-actions .text-button{font-size:14px;min-height:40px}
.speech-dialog .primary-button:disabled{opacity:.45;cursor:default}
.voice-room{flex:1;min-height:0;overflow:auto;padding:20px 28px 16px;display:flex;flex-direction:column;gap:13px;background:radial-gradient(ellipse at 30% 0,#eaf1df80,transparent 65%),#fffefa}
.voice-mode-active .conversation-heading,.voice-mode-active .chat-log,.voice-mode-active .suggestions,.voice-mode-active .composer,.voice-mode-active .activity-bar{display:none}
.voice-mode-active .mascot-stage{flex:0 0 118px;min-height:118px;max-height:118px}
.voice-mode-active.has-messages .mascot-stage{flex-basis:80px;min-height:80px;max-height:80px}
.voice-mode-active .stage-copy{padding:12px 28px;width:53%}
.voice-mode-active .stage-copy h1{font-size:28px;line-height:1.12;margin:0}
.voice-mode-active .stage-copy .eyebrow,.voice-mode-active .stage-copy p,.voice-mode-active .stage-tag,.voice-mode-active .mascot-brand,.voice-mode-active .robot-bubble{display:none}
.voice-mode-active .mascot-scene{width:45%}
.voice-mode-active .mascot.trainer-team{width:min(98%,150cqh)}
.voice-room-heading{display:flex;align-items:center;gap:14px;flex-shrink:0}
.voice-room-heading>div:nth-child(2){min-width:0;flex:1}
.voice-eyebrow{color:#53634f;font-size:10px;letter-spacing:1px;font-weight:650}
.voice-room h2{margin:3px 0 0;font-size:23px;line-height:1.25;color:#254d36;letter-spacing:-.5px}
.voice-back{border:1px solid #becdb3;border-radius:12px;padding:8px 12px;min-height:40px;background:#fffefa;color:#34563e;font-size:13px;font-weight:600;flex-shrink:0}
.voice-orb{width:49px;height:49px;flex:0 0 49px;border-radius:50%;display:flex;align-items:center;justify-content:center;gap:3px;background:linear-gradient(145deg,#d4e6c6,#edf2df);box-shadow:inset 0 0 0 1px #acc4a1,0 3px 12px #335a3312}
.voice-orb i{height:12px;width:3px;border-radius:3px;background:#3a6c4b}
.voice-orb i:nth-child(2),.voice-orb i:nth-child(4){height:20px}.voice-orb i:nth-child(3){height:28px}
.voice-room[data-phase="speaking"] .voice-orb i,.voice-room[data-phase="listening"] .voice-orb i{animation:voice-wave .8s ease-in-out infinite alternate}
.voice-orb i:nth-child(2n){animation-delay:-.3s!important}.voice-orb i:nth-child(3n){animation-delay:-.6s!important}
@keyframes voice-wave{to{transform:scaleY(.35)}}
.voice-room-hint{margin:0;font-size:14px;line-height:1.5;color:#52634b;flex-shrink:0}
.voice-room-hint.voice-error{color:#87472d}
.voice-conversation-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;flex-shrink:0;padding:10px 12px;border:1px solid #bfd3b7;border-radius:13px;background:#edf4e6}
.voice-conversation-controls button{border:1px solid #285f48;border-radius:10px;background:#285f48;color:#fff;padding:9px 13px;min-height:44px;font:inherit;font-size:14px;font-weight:650}
.voice-conversation-controls button[aria-pressed="true"]{background:#943e37;border-color:#943e37}
.voice-conversation-controls button:disabled{opacity:.45;cursor:default}
.voice-conversation-controls p{flex:1;min-width:170px;margin:0;font-size:12px;line-height:1.5;color:#365340}
.voice-caption{border:1px solid #cbd9c2;background:#ecf3e6;border-radius:16px;padding:12px 15px;max-height:125px;overflow:auto;flex-shrink:0}
.voice-caption strong{font-size:12px;color:#3c6145}
.voice-caption p{margin:5px 0 0;font-size:16px;line-height:1.6;color:#263e2e;white-space:pre-line;overflow-wrap:anywhere}
.voice-question-form{display:flex;flex-direction:column;gap:7px;flex-shrink:0}
.voice-question-form label,.voice-settings label{font-size:12px;font-weight:600;color:#40583e}
.voice-question-form textarea{width:100%;min-height:70px;max-height:110px;resize:vertical;border:1px solid #b8cbae;border-radius:13px;padding:11px 13px;font:inherit;font-size:16px;line-height:1.5;color:#243b2d;background:#f9fbf5}
.voice-question-form textarea:focus{outline:2px solid #91ad83;outline-offset:2px}
.voice-room-controls{display:flex;flex-wrap:wrap;gap:8px;margin-top:3px}
.voice-room-controls button,.voice-settings button{border:1px solid #b4c7a9;border-radius:12px;background:#f3f7ee;color:#31553c;padding:9px 14px;min-height:42px;font-size:14px;font-weight:600}
.voice-room-controls #voice-send{background:#285f48;color:#fff;border-color:#285f48}
.voice-room-controls button:disabled,.voice-settings button:disabled{opacity:.45;cursor:default}
.voice-room-controls #voice-record[aria-pressed="true"]{background:#9a3834;color:#fff;border-color:#9a3834}
.voice-settings{flex-shrink:0;color:#4c6249;font-size:13px}
.voice-settings summary{cursor:pointer;min-height:28px;line-height:1.7;text-decoration:underline;text-underline-offset:3px}
.voice-settings-content{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:8px 0 2px}
.voice-settings label{flex-basis:100%}.voice-settings select{flex:1;min-width:150px;min-height:38px;max-width:100%;border:1px solid #b9cdb0;border-radius:9px;padding:7px;color:#2e4d38;background:#fffefa;font:inherit}
.voice-settings-content p{flex-basis:100%;margin:0;font-size:12px;line-height:1.6}
.voice-room-footer{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-top:auto;padding-top:8px;border-top:1px solid #e1e9db;flex-shrink:0;font-size:11px;color:#53634f}
.voice-room-footer>span{flex:1}.voice-room-footer a{color:#315b40;min-height:26px;display:inline-flex;align-items:center;text-underline-offset:3px}
@media(max-width:540px){
  .voice-room{padding:16px 17px 12px;gap:12px}
  .voice-mode-active .mascot-stage{flex-basis:110px;min-height:110px;max-height:110px}
  .voice-mode-active .stage-copy{padding-left:18px}
  .voice-mode-active .stage-copy h1{font-size:24px}
  .voice-room-heading{gap:10px;flex-wrap:wrap}
  .voice-room h2{font-size:21px}.voice-eyebrow{font-size:9px}
  .voice-back{font-size:12px;padding:7px 9px}
  .voice-orb{width:40px;height:40px;flex-basis:40px}
  .voice-room-controls button{min-height:44px;font-size:13px;padding:9px 12px}
  .voice-caption{max-height:160px}.voice-caption p{font-size:15px}
  .voice-room-footer>span{flex-basis:100%}
}
@media(max-height:600px){.voice-mode-active .mascot-stage{flex-basis:80px;min-height:80px;max-height:80px}.voice-room{padding-block:12px}}
.trainer-mouths{display:none;position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none}
.trainer-mouth{display:none}
.is-speaking .trainer-mouths{display:block}
.is-speaking[data-speaker="0"] .mouth-cap,.is-speaking[data-speaker="1"] .mouth-hair{display:block}
.mouth-opening{transform-box:fill-box;transform-origin:center;animation:trainer-talk .28s ease-in-out infinite alternate}
@keyframes trainer-talk{0%,100%{transform:scaleY(.15)}35%{transform:scaleY(.85)}65%{transform:scaleY(.45)}}
.motion-paused .trainer-mouths{display:none!important}
@media(prefers-reduced-motion:reduce){.trainer-mouths{display:none!important}}
@media(max-width:540px){
  .brand{min-width:0;flex:1}
  .brand strong{white-space:nowrap}
  .brand small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .voice-status{font-size:12px}
  .microphone-button{flex-basis:36px;width:36px}
  .speech-dialog{max-height:calc(100dvh - 30px);overflow:auto}
}
@media(max-width:800px){.composer-footer .footer-links{margin-left:auto}}
@media(max-width:540px){
  .composer-footer{align-items:center}
  .composer-footer>span:first-child{flex-basis:100%}
  .composer-footer .footer-links{margin-left:auto}
  .footer-links{gap:0 13px}
  .footer-links a,.footer-links .text-button{font-size:12px;min-height:30px}
}

.message-bubble a{color:#17563e;font-weight:650;text-decoration:underline;text-underline-offset:3px}
.message-bubble a:hover{color:#103d2c}
.message-bubble a:focus-visible{outline:2px solid #17563e;outline-offset:3px;border-radius:2px}

/* Small, decorative waiting scene; reuses the shop's existing character layers. */
.activity-bar{flex-direction:column;align-items:flex-start;gap:3px;padding-top:0}
.waiting-caption{display:flex;align-items:center;gap:8px;min-height:20px}
.waiting-pets{width:176px;height:90px;flex:none;pointer-events:none;user-select:none;overflow:hidden}
.waiting-game{position:relative;width:176px;height:90px;transform-origin:left bottom}
.waiting-game .waiting-layer{position:absolute;left:14px;bottom:0;width:148px;height:92px;max-width:none;object-fit:fill}
.waiting-bodies{animation:waiting-bob 3.2s ease-in-out infinite}
.waiting-hand-left{transform-origin:8% 62%;animation:waiting-throw-left 3.2s ease-in-out infinite}
.waiting-hand-right{transform-origin:92% 62%;animation:waiting-throw-right 3.2s ease-in-out infinite}
.waiting-still{display:none}
.waiting-floor{position:absolute;left:25px;right:25px;bottom:0;height:7px;border-radius:50%;background:#b7c7a92b}
.waiting-ball-flight{position:absolute;left:0;top:0;width:12px;height:12px;transform:translate(23px,31px);animation:waiting-toss 3.2s linear infinite}
.waiting-ball{display:block;width:12px;height:12px;border:1.4px solid #294a41;border-radius:50%;background:linear-gradient(#ee7961 0 44%,#294a41 44% 57%,#fffdf2 57%);box-shadow:0 1px 2px #294a4126;animation:waiting-spin 3.2s linear infinite}
.waiting-ball:after{content:"";position:absolute;width:4px;height:4px;border:1px solid #294a41;border-radius:50%;background:#fffdf2;left:4px;top:4px}
.waiting-ball-shadow{position:absolute;left:0;top:78px;width:13px;height:3px;border-radius:50%;background:#6e856433;transform:translateX(23px);animation:waiting-shadow 3.2s linear infinite}
.waiting-catch{position:absolute;font-size:14px;color:#bc8d35;line-height:1;opacity:0;animation:waiting-catch-left 3.2s ease-out infinite}
.waiting-catch-left{left:13px;top:23px}
.waiting-catch-right{right:13px;top:23px;animation-name:waiting-catch-right}
@keyframes waiting-toss{0%,8%,100%{transform:translate(23px,31px)}18%{transform:translate(45px,9px)}28%{transform:translate(82px,0)}38%{transform:translate(119px,9px)}48%,58%{transform:translate(141px,31px)}68%{transform:translate(119px,9px)}78%{transform:translate(82px,0)}88%{transform:translate(45px,9px)}98%{transform:translate(23px,31px)}}
@keyframes waiting-spin{0%,8%{rotate:0deg}48%,58%{rotate:360deg}98%,100%{rotate:0deg}}
@keyframes waiting-throw-left{0%,100%{transform:rotate(0)}6%{transform:rotate(13deg)}13%{transform:rotate(-12deg)}23%,83%{transform:rotate(0)}94%{transform:rotate(-7deg)}}
@keyframes waiting-throw-right{0%,42%,100%{transform:rotate(0)}49%{transform:rotate(7deg)}56%{transform:rotate(-13deg)}63%{transform:rotate(12deg)}73%{transform:rotate(0)}}
@keyframes waiting-bob{0%,45%,100%{transform:translateY(0)}12%,62%{transform:translateY(-1.5px)}25%,75%{transform:translateY(0)}}
@keyframes waiting-shadow{0%,8%,100%{transform:translateX(23px) scaleX(1);opacity:.6}28%,78%{transform:translateX(82px) scaleX(.45);opacity:.2}48%,58%{transform:translateX(141px) scaleX(1);opacity:.6}}
@keyframes waiting-catch-left{0%,90%,100%{opacity:0;transform:scale(.5)}96%{opacity:1;transform:scale(1.1)}}
@keyframes waiting-catch-right{0%,42%,56%,100%{opacity:0;transform:scale(.5)}49%{opacity:1;transform:scale(1.1)}}
.motion-paused .waiting-game .waiting-animated{display:none}
.motion-paused .waiting-game .waiting-still{display:block}
.motion-paused .waiting-catch,.motion-paused .waiting-ball-shadow{display:none}
@media(max-width:540px),(max-height:650px){.waiting-pets{width:132px;height:65px}.waiting-game{transform:translateY(-25px) scale(.74)}.activity-bar{padding-bottom:6px;gap:1px}}
@media(prefers-reduced-motion:reduce){.waiting-game *{animation:none!important}.waiting-game .waiting-animated{display:none}.waiting-game .waiting-still{display:block}.waiting-catch,.waiting-ball-shadow{display:none}}