.companion[hidden],.companion-panel[hidden]{display:none!important}
.companion{position:fixed;z-index:70;left:20px;bottom:20px;font-family:"Noto Sans Arabic",Tahoma,sans-serif;--pet-ink:#5b3650;--pet-rose:#d94e8a;--pet-soft:#ffe4ef;--pet-head:linear-gradient(110deg,#fff0f6,#ffe2ee);--pet-border:#f0cadb;--pet-sprite:url('assets/kitty-pet-sprite.png?v=20261015-wardrobe');--pet-dance-sprite:url('assets/kitty-pet-dance.png?v=20261015-wardrobe')}
.companion[data-character="kitty"][data-outfit="white"]{--pet-sprite:url('assets/kitty-outfit-white.png?v=20261015-wardrobe');--pet-dance-sprite:url('assets/kitty-outfit-white-dance.png?v=20261015-wardrobe')}
.companion[data-character="kitty"][data-outfit="pink"]{--pet-sprite:url('assets/kitty-outfit-pink.png?v=20261015-wardrobe');--pet-dance-sprite:url('assets/kitty-outfit-pink-dance.png?v=20261015-wardrobe')}
.companion[data-character="kitty"][data-outfit="lilac"]{--pet-sprite:url('assets/kitty-outfit-lilac.png?v=20261015-wardrobe');--pet-dance-sprite:url('assets/kitty-outfit-lilac-dance.png?v=20261015-wardrobe')}
.companion[data-character="spidey"]{--pet-ink:#20466c;--pet-rose:#dc4a56;--pet-soft:#e5f1ff;--pet-head:linear-gradient(110deg,#e9f5ff,#ffe9ec);--pet-border:#c9dfef;--pet-sprite:url('assets/spidey-pet-sprite.png?v=20261015-pet-dance')}
.companion[data-character="batman"]{--pet-ink:#252348;--pet-rose:#8060a8;--pet-soft:#ece9fa;--pet-head:linear-gradient(110deg,#eae8fa,#f7edf9);--pet-border:#d4ceec;--pet-sprite:url('assets/batman-pet-sprite.png?v=20261015-pet-dance')}
.companion-launch{position:relative;display:grid;justify-items:center;gap:0;width:128px;padding:0 0 5px;border:0;background:transparent;color:var(--pet-ink);filter:drop-shadow(0 9px 10px #7b2d5340);transform-origin:center bottom;cursor:pointer}
.companion-launch:hover{filter:drop-shadow(0 12px 15px #a7356b66)}
.companion-launch:focus-visible{outline:3px solid var(--pet-rose);outline-offset:4px;border-radius:20px}
.companion-character{display:block;width:128px;height:128px;background-image:var(--pet-sprite);background-repeat:no-repeat;background-size:200% 200%;background-position:0 0;transform-origin:center bottom;will-change:transform}
.companion-character[data-pose="blink"]{background-position:100% 0}
.companion-character[data-pose="jump"],.companion-character[data-pose="dance2"]{background-position:0 100%}
.companion-character[data-pose="wave"],.companion-character[data-pose="dance3"]{background-position:100% 100%}
.companion-character[data-pose="dance1"]{background-position:100% 0}
.companion-character[data-pose="dance0"]{background-position:0 0}
.companion[data-character="kitty"] .companion-character[data-pose^="dance"]{background-image:var(--pet-dance-sprite)}
.companion-label{position:absolute;bottom:0;padding:2px 11px;border:2px solid #fff;background:var(--pet-soft);color:var(--pet-ink);border-radius:100px;font-size:11px;font-weight:900;white-space:nowrap;box-shadow:0 4px 10px #793a5a30}
.companion-launch.hop{animation:pet-hop .75s cubic-bezier(.2,.7,.3,1) both}
.companion-launch.dancing{animation:pet-dance 1.9s ease-in-out both}
.companion-launch.dancing[data-dance="hop"]{animation:pet-dance-hop 1.9s ease-in-out both}
.companion-launch.dancing[data-dance="twirl"]{animation:pet-dance-twirl 1.9s ease-in-out both}
.companion-launch.dancing[data-dance="parade"]{animation:pet-dance-parade 2.3s ease-in-out both}
.companion-launch.dancing::before,.companion-launch.dancing::after{content:'✦';position:absolute;z-index:1;top:13px;color:#ffc04d;font-size:21px;animation:pet-sparkle .62s ease-in-out infinite alternate;pointer-events:none}
.companion-launch.dancing::before{left:0}.companion-launch.dancing::after{right:1px;animation-delay:.25s}
.companion-launch.celebrating{animation:pet-celebrate .82s cubic-bezier(.3,.8,.24,1) both}
.companion-launch.celebrating::before,.companion-launch.celebrating::after{content:'✦';position:absolute;z-index:2;top:8px;color:#ffbe48;font-size:25px;animation:pet-sparkle .4s ease-in-out infinite alternate;pointer-events:none}
.companion-launch.celebrating::before{left:-8px}.companion-launch.celebrating::after{right:-8px;animation-delay:.15s}
.companion-launch.sad-exit{animation:pet-sad-exit 1.12s cubic-bezier(.45,.02,.55,1) forwards;pointer-events:none}
.companion-launch.sad-exit::before,.companion-launch.sad-exit::after{content:'💧';position:absolute;z-index:2;top:34px;font-size:18px;animation:pet-tear .7s ease-in forwards;pointer-events:none}
.companion-launch.sad-exit::before{left:16px}.companion-launch.sad-exit::after{right:17px;animation-delay:.16s}
.companion-panel{position:absolute;left:0;bottom:150px;display:flex;flex-direction:column;width:min(360px,calc(100vw - 28px));height:min(500px,calc(100dvh - 195px));min-height:315px;overflow:hidden;border:1px solid var(--pet-border);border-radius:23px;background:var(--surface);color:var(--text);box-shadow:0 24px 65px #4d183c38;animation:pet-panel-in .25s ease-out}
.companion-panel-head{display:flex;align-items:center;gap:10px;padding:13px 15px;background:var(--pet-head);border-bottom:1px solid var(--pet-border);color:var(--pet-ink)}
.companion-panel-head .pet-badge{width:36px;height:36px;display:grid;place-items:center;border-radius:12px;background:#fff;color:var(--pet-rose);font-size:23px;box-shadow:0 2px 8px #b8507a1c}
.companion-panel-head .pet-badge svg{width:25px;height:20px}
.companion[data-character="spidey"] .pet-badge,.companion[data-character="batman"] .pet-badge{font-size:21px;color:#3b8eb4}
.companion-panel-head strong{display:block;font-size:14px;line-height:1.2}.companion-panel-head small{display:block;font-size:10px;color:#8d6379}
.companion-wardrobe-toggle{margin-inline-start:auto;width:32px;height:32px;border:0;border-radius:10px;background:#ffffffcb;color:var(--pet-rose);font-size:21px;line-height:1;cursor:pointer}
.companion-wardrobe-toggle[hidden],.companion-wardrobe[hidden]{display:none!important}
.companion-dance{width:32px;height:32px;border:0;border-radius:10px;background:#ffffffcb;color:var(--pet-rose);font-size:22px;line-height:1;cursor:pointer}
.companion-close{width:32px;height:32px;border:0;border-radius:10px;background:#fff9fc;color:var(--pet-ink);font-size:22px;line-height:1}
.companion-switcher,.companion-wardrobe{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:7px 9px;border-bottom:1px solid var(--pet-border);background:var(--surface)}
.companion-wardrobe{grid-template-columns:repeat(4,minmax(0,1fr));background:var(--pet-soft)}
.companion-switcher button,.companion-wardrobe button{display:flex;align-items:center;justify-content:center;gap:3px;min-width:0;padding:3px 4px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--pet-ink);font-size:10px;font-weight:800;cursor:pointer}
.companion-wardrobe button{display:grid;justify-items:center;gap:1px;padding:5px 2px;font-size:9px}
.companion-switcher button.active,.companion-wardrobe button.active{border-color:var(--pet-rose);box-shadow:inset 0 0 0 1px var(--pet-rose)}
.pet-switch-art,.pet-outfit-art{display:block;flex:none;width:31px;height:31px;background-size:200% 200%;background-position:0 0;background-repeat:no-repeat}
.pet-outfit-art{width:46px;height:46px}
.pet-switch-art.kitty,.pet-outfit-art.classic{background-image:url('assets/kitty-pet-sprite.png?v=20261015-wardrobe')}
.pet-switch-art.spidey{background-image:url('assets/spidey-pet-sprite.png?v=20261015-wardrobe')}
.pet-switch-art.batman{background-image:url('assets/batman-pet-sprite.png?v=20261015-wardrobe')}
.pet-outfit-art.white{background-image:url('assets/kitty-outfit-white.png?v=20261015-wardrobe')}
.pet-outfit-art.pink{background-image:url('assets/kitty-outfit-pink.png?v=20261015-wardrobe')}
.pet-outfit-art.lilac{background-image:url('assets/kitty-outfit-lilac.png?v=20261015-wardrobe')}
.companion-messages{flex:1;overflow:auto;display:flex;flex-direction:column;gap:10px;padding:14px;background:linear-gradient(180deg,var(--surface),var(--bg))}
.companion-message{max-width:88%;padding:10px 12px;border-radius:15px 15px 4px 15px;background:var(--pet-soft);color:var(--pet-ink);font-size:12px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}
.companion-message.mine{align-self:flex-end;border-radius:15px 15px 15px 4px;background:var(--green-soft);color:var(--text)}
.companion-message a{display:inline-flex;margin-top:6px;color:var(--green-2);font-weight:800;text-decoration:underline;text-underline-offset:3px}
.companion-quick{display:flex;gap:6px;overflow:auto;padding:8px 12px;scrollbar-width:none}.companion-quick::-webkit-scrollbar{display:none}
.companion-quick button{flex:none;border:1px solid var(--line);border-radius:100px;padding:5px 9px;background:var(--surface);color:var(--green-2);font-size:10px;font-weight:800}
.companion-compose{display:flex;gap:6px;padding:10px 11px;border-top:1px solid var(--line);background:var(--surface)}
.companion-compose input{min-width:0;flex:1;border:1px solid var(--line);border-radius:11px;padding:8px 10px;background:var(--bg);color:var(--text);font-size:12px}
.companion-compose button{flex:none;width:33px;height:33px;display:grid;place-items:center;border:0;border-radius:10px;background:var(--green-soft);color:var(--green-2);font-size:16px}
.companion-compose button[type="submit"]{background:var(--green);color:#fff}
.companion-compose button.listening{background:#ffe1e9;color:#b63464;animation:pet-listening 1s ease-in-out infinite}
.companion-compose button:focus-visible,.companion-close:focus-visible,.companion-dance:focus-visible,.companion-wardrobe-toggle:focus-visible,.companion-switcher button:focus-visible,.companion-wardrobe button:focus-visible,.companion-quick button:focus-visible{outline:3px solid var(--pet-rose);outline-offset:2px}
.companion-note{padding:0 13px 9px;margin:0;background:var(--surface);color:var(--muted);font-size:9px;text-align:center}
.companion-hide-action{align-self:center;margin:0 0 7px;padding:3px 7px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:9px;text-decoration:underline;text-underline-offset:2px;cursor:pointer}.companion-hide-action:focus-visible{outline:2px solid var(--pet-rose);outline-offset:2px}
.pet-picker{margin:15px 0 21px;padding:18px}.pet-picker-head h2{margin:0 0 4px;font-size:17px}.pet-picker-head p{margin:0 0 14px;color:var(--muted);font-size:12px}.pet-picker-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pet-choice{position:relative;display:flex;align-items:center;gap:10px;min-width:0;padding:7px 12px;border:2px solid var(--line);border-radius:17px;background:var(--surface);color:var(--text);cursor:pointer;text-align:start}.pet-choice.active{border-color:var(--green);background:var(--green-soft)}.pet-choice:hover{transform:translateY(-2px)}.pet-choice:focus-visible{outline:3px solid var(--green);outline-offset:2px}.pet-choice-art{display:block;flex:none;width:77px;height:77px;background-size:200% 200%;background-position:0 0;background-repeat:no-repeat}.pet-choice-art.spidey{background-image:url('assets/spidey-pet-sprite.png?v=20261015-pet-dance')}.pet-choice-art.batman{background-image:url('assets/batman-pet-sprite.png?v=20261015-pet-dance')}.pet-choice b{font-size:14px}.pet-choice-check{margin-inline-start:auto;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--green);color:#fff;font-weight:900}.pet-choice:not(.active) .pet-choice-check{background:transparent}
.pet-picker-options{grid-template-columns:repeat(3,minmax(0,1fr))}.pet-choice{flex-direction:column;justify-content:center;gap:2px;padding:7px;min-height:116px;text-align:center}.pet-choice-art.kitty{background-image:url('assets/kitty-pet-sprite.png?v=20261015-wardrobe')}.pet-choice-check{position:absolute;top:6px;inset-inline-end:6px;width:20px;height:20px;margin:0}.pet-choice:not(.active) .pet-choice-check{display:none}
.kitty-wardrobe{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.kitty-wardrobe h3{margin:0 0 10px;font-size:14px}.outfit-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.outfit-choice{display:grid;justify-items:center;gap:3px;min-width:0;padding:6px 3px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);font-size:10px;font-weight:800;cursor:pointer}.outfit-choice.active{border:2px solid var(--pet-rose,#d94e8a);background:#fff0f6}.outfit-choice:focus-visible,.pet-visibility:focus-visible{outline:3px solid var(--green);outline-offset:2px}.outfit-art{display:block;width:57px;height:57px;background-size:200% 200%;background-position:0 0;background-repeat:no-repeat}.outfit-art.classic{background-image:url('assets/kitty-pet-sprite.png?v=20261015-wardrobe')}.outfit-art.white{background-image:url('assets/kitty-outfit-white.png?v=20261015-wardrobe')}.outfit-art.pink{background-image:url('assets/kitty-outfit-pink.png?v=20261015-wardrobe')}.outfit-art.lilac{background-image:url('assets/kitty-outfit-lilac.png?v=20261015-wardrobe')}.pet-visibility{display:inline-flex;align-items:center;gap:6px;margin-top:13px;padding:7px 10px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--muted);font-size:11px;font-weight:800;cursor:pointer}.pet-visibility svg{width:15px;height:15px}
@keyframes pet-idle{0%,100%{transform:translateY(0) rotate(-3deg)}40%{transform:translate(5px,-6px) rotate(3deg)}65%{transform:translate(-3px,-3px) rotate(-2deg)}}
@keyframes pet-hop{0%,100%{transform:translateY(0) scale(1)}25%{transform:translate(8px,4px) scale(1.08,.85)}54%{transform:translate(-9px,-32px) scale(.94,1.1)}76%{transform:translate(4px,1px) scale(1.07,.91)}}
@keyframes pet-celebrate{0%,100%{transform:translateY(0) scale(1)}18%{transform:translateY(5px) scale(1.15,.78)}42%{transform:translateY(-40px) rotate(-10deg) scale(.95,1.1)}66%{transform:translateY(2px) rotate(8deg) scale(1.08,.9)}82%{transform:translateY(-16px) rotate(-4deg)}}
@keyframes pet-sad-exit{0%{transform:translateY(0) scale(1);opacity:1;filter:saturate(1)}23%{transform:translateY(8px) rotate(-8deg) scale(1.04,.87);filter:saturate(.55)}45%{transform:translateY(1px) rotate(5deg) scale(.92);opacity:1}76%{transform:translateY(16px) rotate(-7deg) scale(.7);opacity:.8}100%{transform:translateY(45px) scale(.3);opacity:0}}
@keyframes pet-tear{from{opacity:0;transform:translateY(0) scale(.7)}35%{opacity:1}to{opacity:0;transform:translateY(45px) scale(1.1)}}
@keyframes pet-dance{0%,100%{transform:translateY(0) rotate(0)}12%,62%{transform:translate(-10px,-9px) rotate(-11deg)}27%,76%{transform:translate(10px,-4px) rotate(12deg)}43%{transform:translateY(3px) scale(1.06,.88)}52%{transform:translateY(-18px) rotate(-5deg)}89%{transform:translateY(-12px) rotate(7deg)}}
@keyframes pet-dance-hop{0%,100%{transform:translateY(0) rotate(0)}12%{transform:translateY(5px) scale(1.09,.82)}28%{transform:translate(-10px,-26px) rotate(-12deg)}43%{transform:translateY(3px) scale(1.1,.85)}60%{transform:translate(12px,-31px) rotate(13deg)}78%{transform:translateY(3px) scale(1.1,.87)}90%{transform:translateY(-11px) rotate(-4deg)}}
@keyframes pet-dance-twirl{0%,100%{transform:translate(0,0) rotate(0) scale(1)}16%{transform:translate(-12px,-12px) rotate(-17deg)}35%{transform:translate(0,-25px) rotate(13deg) scale(.93,1.07)}53%{transform:translate(12px,-10px) rotate(23deg)}70%{transform:translate(0,2px) rotate(-15deg) scale(1.08,.9)}85%{transform:translate(-7px,-16px) rotate(7deg)}}
@keyframes pet-dance-parade{0%,100%{transform:translate(0,0) rotate(0)}14%{transform:translate(10px,-9px) rotate(9deg)}28%{transform:translate(19px,0) rotate(-4deg)}42%{transform:translate(7px,-18px) rotate(-10deg)}58%{transform:translate(-9px,-2px) rotate(8deg)}74%{transform:translate(-18px,-14px) rotate(-7deg)}89%{transform:translate(-8px,-2px) rotate(6deg)}}
@keyframes pet-sparkle{from{opacity:.35;transform:translateY(9px) scale(.6) rotate(-20deg)}to{opacity:1;transform:translateY(-10px) scale(1.12) rotate(20deg)}}
@keyframes pet-panel-in{from{opacity:0;transform:translateY(13px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes pet-listening{50%{box-shadow:0 0 0 7px #ee83ad55}}
@media(max-width:720px){.companion{left:8px;bottom:calc(78px + env(safe-area-inset-bottom))}.companion-launch{width:102px}.companion-character{width:102px;height:102px}.companion-panel{bottom:121px;height:min(440px,calc(100dvh - 225px))}.pet-choice{padding:6px;gap:4px}.pet-choice-art{width:62px;height:62px}.pet-choice b{font-size:12px}}
@media(prefers-reduced-motion:reduce){.companion-launch,.companion-launch.hop,.companion-launch.dancing,.companion-launch.celebrating,.companion-launch.sad-exit,.companion-panel,.companion-compose button.listening{animation:none!important}.companion-launch.dancing::before,.companion-launch.dancing::after,.companion-launch.celebrating::before,.companion-launch.celebrating::after,.companion-launch.sad-exit::before,.companion-launch.sad-exit::after{display:none}}
.companion-launch{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}.companion.is-dragging .companion-launch{cursor:grabbing;animation:none!important;transform:none!important}.companion.is-dragging .companion-launch:before,.companion.is-dragging .companion-launch:after{display:none}.companion.has-3d .companion-launch{width:220px}.companion.has-3d .companion-character{width:220px;height:260px;background:none!important;display:grid;place-items:center;font-size:12px;text-align:center;color:var(--text)}.companion-character canvas{display:block;pointer-events:none;width:100%;height:100%}.companion.has-3d .companion-launch.hop,.companion.has-3d .companion-launch.dancing{animation:none}.pet-choice-art.joker,.pet-switch-art.joker,.pet-choice-art.harley,.pet-switch-art.harley{display:grid;place-items:center;background-image:none!important;background:linear-gradient(135deg,#312047,#69468a);border-radius:18px;color:#c4ec91}.pet-choice-art.joker:after,.pet-switch-art.joker:after{content:'J';font:700 30px Georgia,serif}.pet-choice-art.harley,.pet-switch-art.harley{background:linear-gradient(135deg,#682f46,#325d83);color:#ffe4ef}.pet-choice-art.harley:after,.pet-switch-art.harley:after{content:'H';font:700 30px Georgia,serif}.pet-switch-art.joker:after,.pet-switch-art.harley:after{font-size:16px}.companion-credit{font-size:8px;line-height:1.5;text-align:center;color:var(--muted);padding:0 8px 7px}.companion-credit[hidden]{display:none}@media(max-width:720px){.companion.has-3d .companion-launch{width:180px}.companion.has-3d .companion-character{width:180px;height:235px}}
.pet-choice-art.joker,.pet-switch-art.joker{background-color:#49305e!important}.pet-choice-art.harley,.pet-switch-art.harley{background-color:#783653!important}
.companion-panel{z-index:2}
