#mascot-container.jiggle{animation:jiggle .5s ease-in-out}@keyframes jiggle{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-.125rem) rotate(-2deg)}50%{transform:translateY(0) rotate(2deg)}75%{transform:translateY(-.0625rem) rotate(-1deg)}}@keyframes fadeOutMascotVisual{0%{opacity:1}to{opacity:0}}#mascot-visual-area.visual-fading-out{animation:fadeOutMascotVisual 1.5s ease-out forwards}#mascot-visual-area svg{animation:mascotWobble 3s infinite ease-in-out}@keyframes mascotWobble{0%,to{transform:rotate(-1deg)}50%{transform:rotate(1deg)}}@keyframes hatTip{0%,to{transform:rotate(-10deg)}50%{transform:rotate(-25deg)}}svg.cuppy-cake-specific-styles.animate-hat-tip .hat{transform-origin:25px 30px;animation:hatTip .7s ease-in-out}@keyframes sprinkleShiver{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(.5px,-.5px) rotate(2deg)}50%{transform:translate(-.5px,.5px) rotate(-2deg)}75%{transform:translate(.5px,.5px) rotate(1deg)}}svg.cuppy-cake-specific-styles.animate-sprinkle-shiver .sprinkle{animation:sprinkleShiver .4s linear}@keyframes legTap{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(-5deg)}}#pretzel-pete .left-leg.animate-left-leg-tap{transform-origin:40px 85px;animation:legTap .6s ease-in-out}#pretzel-pete .right-leg.animate-right-leg-tap{transform-origin:60px 85px;animation:legTap .6s ease-in-out}@keyframes armWave{0%,to{transform:rotate(0)}50%{transform:rotate(-20deg)}}#pretzel-pete .left-arm.animate-left-arm-wave{transform-origin:20px 55px;animation:armWave .7s ease-in-out}#pretzel-pete .right-arm.animate-right-arm-wave{transform-origin:80px 55px;animation:armWave .7s ease-in-out}@keyframes hachimakiFlutter{0%,to{transform:rotate(0) skew(0)}50%{transform:rotate(5deg) skew(-5deg)}}svg#sushi-sam.animate-hachimaki-flutter .hachimaki-tie-1{transform-origin:15px 48px;animation:hachimakiFlutter .8s ease-in-out}svg#sushi-sam.animate-hachimaki-flutter .hachimaki-tie-2{transform-origin:15px 50px;animation:hachimakiFlutter .8s ease-in-out .05s}@keyframes makiRoll{0%,to{transform:rotate(0)}50%{transform:rotate(4deg)}}svg#sushi-sam.animate-maki-roll .maki-roll{transform-origin:center bottom;animation:makiRoll .9s ease-in-out}@keyframes cuppyEyeFloat{0%,to{transform:translate(0) scale(1)}20%{transform:translate(-8px,5px) scale(.8)}40%{transform:translate(10px,-7px) scale(1.2)}60%{transform:translate(-5px,-10px) scale(.7)}80%{transform:translate(7px,6px) scale(1.1)}}svg.cuppy-cake-specific-styles.animate-eye-spy .left-eye .pupil{animation:cuppyEyeFloat 2.5s ease-in-out;transform-origin:center}svg.cuppy-cake-specific-styles.animate-eye-spy .right-eye .pupil{animation:cuppyEyeFloat 2.5s ease-in-out .1s;transform-origin:center}.eyes-group.animating-surreal,.eye.animating-surreal{overflow:visible!important}#pretzel-pete .pretzel-body-segment{transition:opacity .5s ease-in-out}#pretzel-pete #pretzel-unravelled-1,#pretzel-pete #pretzel-unravelled-2{opacity:0;pointer-events:none}@keyframes saltCrystalFall{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(1.25rem)}}@keyframes saltCrystalReappear{0%{opacity:0;transform:translateY(1.25rem)}to{opacity:1;transform:translateY(0)}}#pretzel-pete.animate-unraveling .salt-crystal-instance.falling{animation:saltCrystalFall .8s ease-in forwards}#pretzel-pete.animate-unraveling .salt-crystal-instance.reappearing{animation:saltCrystalReappear .8s ease-out forwards}@keyframes unravelledSway{0%,to{transform:rotate(0)}50%{transform:rotate(5deg)}}#pretzel-pete #pretzel-unravelled-2.swaying{transform-origin:50px 15px;animation:unravelledSway 2s ease-in-out infinite}#sushi-sam .nori-void-layer{opacity:0;transition:opacity .3s ease-in-out}#sushi-sam.animate-nori-void .nori-void-layer{opacity:1}@keyframes noriFlapOpen{0%{transform:rotateX(0)}to{transform:rotateX(-70deg)}}@keyframes noriFlapClose{0%{transform:rotateX(-70deg)}to{transform:rotateX(0)}}#sushi-sam.animate-nori-void .nori-flap{transform-origin:50% 0%}#sushi-sam.animate-nori-void .nori-flap.opening{animation:noriFlapOpen .7s ease-out forwards}#sushi-sam.animate-nori-void .nori-flap.closing{animation:noriFlapClose .7s ease-in forwards}@keyframes cosmicSwirl1{0%,to{transform:translate(0) scale(1);opacity:.7}50%{transform:translate(3px,-2px) scale(1.1);opacity:.9}}@keyframes cosmicSwirl2{0%,to{transform:translate(0) scale(1);opacity:.6}50%{transform:translate(-2px,3px) scale(.9);opacity:.8}}#sushi-sam.animate-nori-void .cosmic-particle1{animation:cosmicSwirl1 3s infinite ease-in-out}#sushi-sam.animate-nori-void .cosmic-particle2{animation:cosmicSwirl2 3s infinite ease-in-out .5s}#mascot-image-display.wiggling{animation-name:mascotWobble;animation-duration:.6s;animation-timing-function:ease-in-out}:root{--speech-bubble-max-width: 50rem;--speech-bubble-padding: .6em 1em;--speech-bubble-radius: 15px;--speech-bubble-tail-size: .7rem;--hue: 270;--radius-large: .75rem;--radius-medium: .4rem}.bleepy-banner-container{--text-color-light: oklch(.15 .01 var(--hue));--text-color-dark: oklch(.85 .01 var(--hue));--text-color: var(--text-color-light);--card-bg-light: oklch(.98 .01 var(--hue));--card-bg-dark: oklch(.15 .01 var(--hue));--card-bg: var(--card-bg-light);--border-light: oklch(.85 .01 var(--hue));--border-dark: oklch(.35 .01 var(--hue));--border: var(--border-light);--input-bg-light: oklch(1 0 0);--input-bg-dark: oklch(.1 .01 var(--hue));--input-bg: var(--input-bg-light);position:relative;display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr;grid-template-areas:"visual chat-history ." "chat-ui chat-ui chat-ui";align-items:start;gap:1.5rem;padding:2rem;min-height:24rem;max-height:32rem;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-large);font-family:Comic Sans MS,Chalkboard SE,Marker Felt,sans-serif;box-sizing:border-box}.bleepy-banner-container .mascot-visual-area{grid-area:visual;width:8rem;height:8rem;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:transform .2s ease}.bleepy-banner-container .mascot-visual-area:hover{transform:scale(1.05)}.bleepy-banner-container .mascot-visual-area svg{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.bleepy-banner-container .speech-bubble{position:absolute;top:1rem;left:10rem;max-width:var(--speech-bubble-max-width);padding:var(--speech-bubble-padding);background:var(--card-bg);border:1px solid var(--border);border-radius:var(--speech-bubble-radius);font-size:.9rem;color:var(--text-color);opacity:0;pointer-events:none;box-shadow:0 4px 12px #0000001a;z-index:1000;transition:opacity .3s ease-out,transform .3s ease-out}.bleepy-banner-container .speech-bubble.appearing{animation:speech-appear .8s ease-out forwards}.bleepy-banner-container .speech-bubble.fading{animation:speech-fade 1.2s ease-in forwards}@keyframes speech-appear{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0);pointer-events:auto}}@keyframes speech-fade{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px);pointer-events:none}}.bleepy-banner-container .chat-history-window{grid-area:chat-history;height:18rem;overflow-y:auto;padding:1rem;background:var(--input-bg);border:1px solid var(--border);border-radius:var(--radius-medium);font-size:.9rem;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.bleepy-banner-container .chat-history-window::-webkit-scrollbar{width:8px}.bleepy-banner-container .chat-history-window::-webkit-scrollbar-track{background:transparent}.bleepy-banner-container .chat-history-window::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.bleepy-banner-container .chat-history-window::-webkit-scrollbar-thumb:hover{background:var(--text-color)}.bleepy-banner-container .chat-ui{grid-area:chat-ui;display:flex;gap:.75rem;padding:1rem;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-medium)}.bleepy-banner-container .chat-input{flex:1;padding:.75rem 1rem;border:1px solid var(--border);border-radius:var(--radius-medium);background:var(--input-bg);color:var(--text-color);font-family:inherit;font-size:.9rem;transition:border-color .2s ease,box-shadow .2s ease}.bleepy-banner-container .chat-input::-moz-placeholder{color:oklch(.5 .01 var(--hue))}.bleepy-banner-container .chat-input::placeholder{color:oklch(.5 .01 var(--hue))}.bleepy-banner-container .chat-input:focus{outline:none;border-color:var(--primary, #3b82f6);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary, #3b82f6) 20%,transparent)}.bleepy-banner-container .chat-send{padding:.75rem 1.5rem;background:var(--primary, #3b82f6);color:#fff;border:none;border-radius:var(--radius-medium);font-family:inherit;font-size:.9rem;font-weight:600;cursor:pointer;transition:background-color .2s ease,transform .1s ease}.bleepy-banner-container .chat-send:hover:not(:disabled){background:var(--primary-hover, #2563eb);transform:translateY(-1px)}.bleepy-banner-container .chat-send:disabled{opacity:.6;cursor:not-allowed;transform:none}.bleepy-banner-container .mascot-image.wiggling{animation:mascotWobble .6s ease-in-out}@keyframes mascotWobble{0%,to{transform:rotate(0) scale(1)}25%{transform:rotate(-3deg) scale(1.05)}50%{transform:rotate(3deg) scale(1.1)}75%{transform:rotate(-2deg) scale(1.05)}}@media (prefers-color-scheme: dark){.bleepy-banner-container{--text-color: var(--text-color-dark);--card-bg: var(--card-bg-dark);--border: var(--border-dark);--input-bg: var(--input-bg-dark)}.bleepy-banner-container .chat-input::-moz-placeholder{color:oklch(.6 .01 var(--hue))}.bleepy-banner-container .chat-input::placeholder{color:oklch(.6 .01 var(--hue))}}@media (max-width: 768px){.bleepy-banner-container{grid-template-columns:1fr;grid-template-rows:auto auto 1fr auto;grid-template-areas:"visual" "speech" "chat-history" "chat-ui";gap:1rem;padding:1.5rem;min-height:28rem}.bleepy-banner-container .mascot-visual-area{width:6rem;height:6rem;justify-self:center}.bleepy-banner-container .speech-bubble{position:relative;top:auto;left:auto;grid-area:speech;max-width:none}.bleepy-banner-container .chat-history-window{height:12rem}}
