.pip-music{border:1px solid #d8dfd1;background:#f6f7f0;color:#345441;border-radius:20px;padding:7px 10px;font-size:10px;font-weight:700;cursor:pointer;white-space:nowrap}.pip-music:hover,.pip-music:focus-visible{background:#e7eddf}.pip-music.pip-music-on{background:#dce8d7;border-color:#8ea78f}.pip-head{gap:9px}.pip-head>div{min-width:0;flex:1}.pip-head .pip-close{flex:0 0 auto}@media(max-width:430px){.pip-music{font-size:9px;padding:6px 7px}.pip-head{gap:6px}}

/* Pip 2.0 — soft rubber mascot with an adaptive halo and expression states */
.pip-btn-av,.pip-head-av,.pip-av{overflow:visible!important;background:transparent!important}
.pip-mascot{--halo:#ffd66d;--halo-glow:rgba(255,205,83,.65);display:block;position:relative;width:100%;height:100%;overflow:visible;isolation:isolate}
.pip-art{display:block;width:100%;height:100%;overflow:visible;animation:pip-float 3.8s ease-in-out infinite;transform-origin:50% 60%}
.pip-halo{fill:none;stroke:var(--halo);stroke-width:3.5;filter:drop-shadow(0 0 3px var(--halo-glow));transform-origin:50% 12%;animation:pip-halo-hover 4.5s ease-in-out infinite}
.pip-body{fill:url(#pipBody);stroke:#dce2e6;stroke-width:.65;filter:drop-shadow(0 2px 2px rgba(34,52,68,.12))}
.pip-head{fill:url(#pipRubber);stroke:#e1e6e9;stroke-width:.7;filter:drop-shadow(0 3px 4px rgba(34,52,68,.13))}
.pip-shadow{fill:rgba(30,48,65,.16);filter:url(#pipShadow)}
.pip-eye{fill:#24313d;stroke:#24313d;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.pip-mouth{fill:none;stroke:#9d4e4a;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.pip-mouth-open{fill:#a94e51;stroke:#873f48;stroke-width:1}
.pip-brow{fill:none;stroke:#24313d;stroke-width:2.2;stroke-linecap:round}
.pip-blush{fill:#f2a5a0;opacity:.45;filter:blur(1.2px)}
.pip-spark{fill:none;stroke:#f3c95d;stroke-width:2;stroke-linecap:round}
.pip-face{display:none}
.pip-state-idle .pip-face-idle,.pip-state-thinking .pip-face-thinking,.pip-state-witty .pip-face-witty,.pip-state-talking .pip-face-talking,.pip-state-excited .pip-face-excited,.pip-state-sleepy .pip-face-sleepy{display:block}
.pip-state-thinking .pip-art{animation:pip-think 1.8s ease-in-out infinite}
.pip-state-thinking .pip-halo{animation:pip-halo-think 1.8s ease-in-out infinite}
.pip-state-witty .pip-art{animation:pip-witty .8s ease-in-out 2}
.pip-state-witty .pip-spark{animation:pip-sparkle .7s ease-in-out infinite alternate}
.pip-state-talking .pip-mouth-open{animation:pip-talk .34s ease-in-out infinite alternate;transform-origin:50% 67%}
.pip-state-excited .pip-art{animation:pip-bounce .65s ease-in-out 3}
.pip-state-sleepy .pip-art{animation:pip-sleep 4s ease-in-out infinite}
.pip-mascot[data-time="morning"]{--halo:#ffc94f;--halo-glow:rgba(255,194,65,.8)}
.pip-mascot[data-time="afternoon"]{--halo:#ff9d45;--halo-glow:rgba(255,157,69,.72)}
.pip-mascot[data-time="evening"]{--halo:#eaa0ef;--halo-glow:rgba(234,160,239,.8)}
.pip-mascot[data-time="night"]{--halo:#79dfff;--halo-glow:rgba(91,190,255,.8)}
.pip-btn-av .pip-mascot{width:54px;height:62px;margin:-9px -7px -9px -5px}
.pip-head-av .pip-mascot{width:52px;height:62px;margin:-8px -6px}
.pip-av .pip-mascot{width:34px;height:40px;margin:-4px}
.pip-btn-av{width:42px;height:42px;overflow:visible}
.pip-head-av{width:40px;height:42px;overflow:visible}
.pip-av{width:26px;height:26px;overflow:visible}
@keyframes pip-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes pip-halo-hover{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(5deg) translateY(-1px)}}
@keyframes pip-halo-think{0%,100%{transform:rotate(-13deg)}50%{transform:rotate(13deg)}}
@keyframes pip-think{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(1px,-1px) rotate(2deg)}}
@keyframes pip-witty{0%,100%{transform:rotate(0)}50%{transform:rotate(-5deg) translateY(-2px)}}
@keyframes pip-sparkle{from{opacity:.35;transform:scale(.8)}to{opacity:1;transform:scale(1.15)}}
@keyframes pip-talk{from{transform:scaleY(.65)}to{transform:scaleY(1.25)}}
@keyframes pip-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes pip-sleep{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(2px) rotate(2deg)}}
@media(prefers-reduced-motion:reduce){.pip-art,.pip-halo,.pip-state-thinking .pip-art,.pip-state-thinking .pip-halo,.pip-state-witty .pip-art,.pip-state-excited .pip-art,.pip-state-sleepy .pip-art,.pip-state-talking .pip-mouth-open{animation:none!important}}

/* In-chat career mini-assessment */
.pip-career-options{display:grid;grid-template-columns:1fr;gap:7px;margin:12px 0 3px}
.pip-career-option{appearance:none;text-align:left;border:1px solid rgba(91,111,153,.2);border-radius:13px;padding:10px 12px;background:rgba(255,255,255,.78);color:#26334b;font:inherit;font-size:13px;line-height:1.35;cursor:pointer;box-shadow:0 2px 8px rgba(48,66,100,.05);transition:transform .16s ease,border-color .16s ease,background .16s ease}
.pip-career-option:hover:not(:disabled),.pip-career-option:focus-visible{background:#fff;border-color:#91a8ef;transform:translateY(-1px);outline:2px solid rgba(112,139,225,.28);outline-offset:2px}
.pip-career-option:disabled{opacity:.55;cursor:default}
@media(prefers-reduced-motion:reduce){.pip-career-option{transition:none}.pip-career-option:hover:not(:disabled){transform:none}}