.companion-dock{display:flex;align-items:center;gap:8px;flex:0 0 46px;min-height:46px;max-width:420px;align-self:flex-start;margin-top:3px;contain:layout paint;overflow:hidden}
.companion-dock[hidden]{display:none}.companion-sprite{width:54px;height:44px;flex:0 0 54px;border:0;background:transparent;padding:0;cursor:pointer;touch-action:manipulation}.companion-sprite svg{width:44px;height:44px;overflow:visible}
.companion-copy{min-width:0;flex:1;line-height:1.3}.companion-name{display:block;font-size:.6rem;color:var(--muted);font-weight:500}.companion-line{display:block;font-size:.7rem;color:#c4c4ce;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.companion-close{border:0;background:transparent;color:var(--muted);padding:0;width:32px;height:36px;flex:0 0 32px;font-size:1rem;cursor:pointer}.companion-sprite:focus-visible,.companion-close:focus-visible,.companion-settings button:focus-visible{outline:2px solid var(--acid);outline-offset:-2px;border-radius:8px}
.companion-settings{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-start;margin-top:4px}.companion-settings .text-button{font-size:.7rem;min-height:32px}
.companion-gallery{overflow:auto;max-width:560px}.companion-gallery .scoreboard-heading{margin-bottom:12px}.companion-gallery p{font-size:.75rem;line-height:1.8;color:var(--muted)}.companion-collection{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:16px 0}.companion-preview{min-width:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:8px 3px;border:1px solid var(--line);border-radius:12px}.companion-preview.current{border-color:var(--acid);background:#e8ff4708}.companion-preview svg{width:64px;height:64px;max-width:100%}.companion-preview strong{font-size:.75rem}.companion-preview small{font-size:.6rem;color:var(--muted);line-height:1.8;margin-top:3px}
.companion-sleep-eyes{display:none}.companion-eyes{transform-box:fill-box;transform-origin:center}.companion-right-arm{transform-box:fill-box;transform-origin:0 100%}
[data-action=wave] .companion-right-arm{animation:companion-wave .45s ease-in-out 4 alternate}
[data-action=hop] .companion-sprite svg{animation:companion-hop .65s ease-in-out 3}
[data-action=shuffle] .companion-sprite svg{animation:companion-shuffle 1.6s ease-in-out 2}
[data-action=look] .companion-eyes{animation:companion-look 2s ease-in-out 2}
[data-action=blink] .companion-eyes{animation:companion-blink 2s 2}
[data-action=nap] .companion-eyes{display:none}[data-action=nap] .companion-sleep-eyes{display:initial}[data-action=nap] .companion-sprite svg{animation:companion-nap 2s ease-in-out 2}
@keyframes companion-wave{to{transform:rotate(-22deg)}}@keyframes companion-hop{50%{transform:translateY(-4px) rotate(4deg)}}@keyframes companion-shuffle{30%{transform:translateX(-8px) rotate(-4deg)}70%{transform:translateX(8px) rotate(4deg)}}@keyframes companion-look{40%,70%{transform:translateX(2px)}}@keyframes companion-blink{8%,12%,68%,72%{transform:scaleY(.1)}0%,20%,60%,80%,100%{transform:scaleY(1)}}@keyframes companion-nap{50%{transform:translateY(1px) rotate(-3deg)}}
@media(max-width:760px){.companion-dock{max-width:100%;align-self:stretch;flex-basis:42px;min-height:42px}.companion-sprite{height:40px}.companion-sprite svg{width:40px;height:40px}.companion-collection{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-height:560px){.companion-dock{display:none}.companion-preview svg{height:42px}.companion-collection{margin:8px 0}.companion-gallery p{margin:4px 0}}
body:has(dialog[open]) .companion-dock,body:has(.prediction-card.mobile-open) .companion-dock{visibility:hidden}
@media(prefers-reduced-motion:reduce){.companion-dock *{animation:none!important;transition:none!important}}
