/* Companion: isolated viewport layer, never participates in page/grid layout. */
.companion-stage { display:block; pointer-events:none; --companion-size:112px; --safe-top:env(safe-area-inset-top, 0px); --safe-bottom:env(safe-area-inset-bottom, 0px); }
.companion-stage[hidden],.companion-stage [hidden] { display:none !important; }
.companion-stage .companion-fab { display:block; position:fixed; z-index:60; mix-blend-mode:multiply; width:var(--companion-size); height:var(--companion-size); min-width:0; min-height:0; left:0; top:0; right:auto; bottom:auto; border:0; border-radius:20px; padding:0; background:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; touch-action:none; pointer-events:auto; cursor:grab; overflow:visible; transition:none; user-select:none; -webkit-user-select:none; -webkit-tap-highlight-color:transparent; }
.companion-stage .companion-fab:hover,.companion-stage .companion-fab:active { background:transparent; box-shadow:none; transform:none; }
.companion-stage .companion-fab:focus-visible,.companion-stage button:focus-visible { outline:3px solid var(--color-primary); outline-offset:3px; }
.companion-stage .companion-avatar-fab { display:block; width:100%; height:100%; pointer-events:none; transform-origin:50% 85%; animation:companion-breathe 4.8s ease-in-out infinite; }
.companion-sprite { display:block; width:100%; height:100%; background-image:url('../assets/assistants/companions-expressions-v1.png'); background-repeat:no-repeat; background-size:400% 400%; background-position:0 var(--sprite-row,0%); }
.companion-stage[data-character="nilo"] { --sprite-row:33.333333%; }
.companion-stage[data-character="pipo"] { --sprite-row:66.666667%; }
.companion-stage[data-character="auri"] { --sprite-row:100%; }
.companion-stage[data-mood="greeting"] .companion-sprite { background-position-x:33.333333%; }
.companion-stage[data-mood="happy"] .companion-sprite { background-position-x:66.666667%; }
.companion-stage[data-mood="resting"] .companion-sprite,.companion-stage[data-blink="true"] .companion-sprite { background-position-x:100%; }
.companion-stage[data-mood="greeting"] .companion-avatar-fab { animation:companion-wave .65s ease-in-out 3; }
.companion-stage[data-mood="happy"] .companion-avatar-fab { animation:companion-hop .65s ease-in-out 3; }
.companion-stage[data-mood="resting"] .companion-avatar-fab { animation:companion-breathe 7s ease-in-out infinite; }
.companion-stage[data-mood="dragging"] .companion-fab { cursor:grabbing; }
.companion-stage[data-mood="dragging"] .companion-avatar-fab { animation:none; transform:rotate(var(--companion-lean, 0deg)) translateY(-4px); }
.companion-emote { position:absolute; right:5px; top:0; color:var(--color-primary); font-size:23px; line-height:1; pointer-events:none; }
.companion-stage[data-mood="happy"] .companion-emote::before { content:'✦'; }
.companion-stage[data-mood="dragging"] .companion-emote::before { content:'!'; }
.companion-stage[data-mood="resting"] .companion-emote::before { content:'z'; color:var(--color-text-muted); font-size:16px; }
.companion-bubble { position:fixed; z-index:61; width:max-content; max-width:min(238px,calc(100vw - 24px)); padding:12px 15px; border:1px solid var(--color-border); border-radius:18px; background:var(--color-surface); color:var(--color-text); box-shadow:0 6px 24px #19243b0c; font:500 13px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; overflow-wrap:anywhere; }
.companion-panel { position:fixed; z-index:61; width:min(290px,calc(100vw - 24px)); padding:16px; border:1px solid var(--color-border); border-radius:22px; background:var(--color-surface); color:var(--color-text); box-shadow:0 14px 48px #19243b22; pointer-events:auto; max-height:calc(100dvh - 32px); overflow-y:auto; overscroll-behavior:contain; }
.companion-panel-heading { display:flex; align-items:flex-start; gap:8px; margin-bottom:14px; }
.companion-panel-heading > div { flex:1; min-width:0; }
.companion-panel strong { display:block; overflow-wrap:anywhere; font-size:17px; }
.companion-panel-heading p,.companion-panel-hint { margin:4px 0 0; color:var(--color-text-muted); font-size:12px; line-height:1.5; }
.companion-stage button { font-family:inherit; }
.companion-panel-heading button { flex:0 0 44px; width:44px; height:44px; margin:-6px -6px 0 0; border:0; border-radius:50%; background:var(--color-bg); color:var(--color-text); font-size:23px; cursor:pointer; }
.companion-talk { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:46px; padding:12px 15px; background:var(--color-primary); color:#fff; border:0; border-radius:12px; font-size:14px; font-weight:600; cursor:pointer; }
.companion-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:8px; }
.companion-actions button { display:flex; gap:8px; align-items:center; justify-content:space-between; min-width:0; min-height:46px; padding:10px; border:1px solid var(--color-border); border-radius:12px; background:var(--color-surface); color:var(--color-text); font-size:12px; font-weight:500; text-align:left; cursor:pointer; }
.companion-actions button:hover,.companion-actions button[aria-pressed="true"] { background:var(--color-primary-tint); }
.companion-actions button:disabled { opacity:.5; cursor:default; }
.companion-panel-hint { text-align:center; margin-top:12px; }
.companion-summon { position:fixed; z-index:61; display:flex; align-items:center; gap:8px; min-height:44px; max-width:210px; padding:10px 15px; border:1px solid var(--color-border); border-radius:24px; background:var(--color-surface); color:var(--color-primary); box-shadow:0 4px 18px #19243b10; font-size:13px; font-weight:600; pointer-events:auto; cursor:pointer; }
.companion-summon span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.companion-preferences { margin:20px 0; padding:16px; background:var(--color-bg); border:1px solid var(--color-border); border-radius:16px; }
.companion-preference-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.companion-preference-actions button { flex:1 1 145px; min-height:44px; font-size:13px; }
.companion-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@keyframes companion-breathe { 0%,100% { transform:translateY(0) rotate(-1deg); } 50% { transform:translateY(-3px) rotate(1deg); } }
@keyframes companion-wave { 0%,100% { transform:rotate(0); } 25% { transform:rotate(-7deg) translateY(-3px); } 70% { transform:rotate(6deg); } }
@keyframes companion-hop { 0%,100% { transform:translateY(0) scale(1); } 40% { transform:translateY(-12px) scale(1.03); } 80% { transform:translateY(0) scale(1.03,.97); } }
@media (max-width:899px) { .companion-stage { --companion-size:96px; } }
.companion-stage[data-motion="still"] .companion-avatar-fab { animation:none; transform:none; }
@media (prefers-reduced-motion:reduce) { .companion-stage .companion-avatar-fab { animation:none !important; transform:none !important; } }