/* 案内人専用。本文・既存の共通UIにはスタイルを広げない。 */
.ai-desk,.ai-desk-ring{box-sizing:border-box}
.ai-desk{position:fixed;right:12px;bottom:16px;z-index:30;display:flex;align-items:flex-end;gap:10px;width:max-content;min-width:0;max-width:calc(100vw - 24px);margin:0;padding:0;border:0;background:transparent;color:#17382f;font:14px/1.7 "Noto Sans JP","Yu Gothic",Meiryo,sans-serif}
.ai-desk *{box-sizing:border-box}
/* 透明な余白は本文の操作へ通し、実際の吹き出しと入口だけがポインターを受ける。 */
.ai-desk{pointer-events:none}
.ai-desk-bubble,.ai-desk-toggle{pointer-events:auto}
.ai-desk[hidden],.ai-desk [hidden],.ai-desk-ring[hidden]{display:none!important}
.ai-desk button{font:inherit;cursor:pointer;letter-spacing:normal;text-transform:none}
.ai-desk button:focus-visible,.ai-desk a:focus-visible{outline:3px solid #658831;outline-offset:3px}
.ai-desk-character{display:flex;flex:none;flex-direction:column;align-items:center;gap:10px}
.ai-desk-hint{position:relative;padding:4px 9px;border:1px solid #b9cdbd;border-radius:10px;background:white;box-shadow:0 3px 10px #17382f22;font-size:12px;line-height:1.6;white-space:nowrap;pointer-events:none}
.ai-desk-hint::after{content:"";position:absolute;left:calc(50% - 5px);bottom:-6px;width:10px;height:10px;border-right:1px solid #b9cdbd;border-bottom:1px solid #b9cdbd;background:white;transform:rotate(45deg)}
/* 全身のビーバー（本人 10/24「Qzビーバーと分かるように大きく、全身が写ると良い」）。丸い背景はなくし、影は絵の形に沿わせる */
.ai-desk-toggle{display:grid;place-items:center;position:relative;flex:none;width:92px;height:92px;padding:0;border:0;border-radius:12px;background:transparent;box-shadow:none}
/* ページ側の button:hover の背景・枠を打ち消す（ビーバーの後ろに色が付かないように） */
.ai-desk .ai-desk-toggle:is(:hover,:active,:focus):not(:disabled){background:transparent;border:0;box-shadow:none}
/* ×もページ側のbutton:hoverに背景を変えられないようにする。focus-visibleの輪郭は残す。 */
.ai-desk [data-close]:is(:hover,:active,:focus):not(:disabled){background:transparent;border:0;box-shadow:none}
.ai-desk-toggle img{display:block;width:88px;height:88px;max-width:none;filter:drop-shadow(0 4px 8px #17382f40)}
.ai-desk-toggle span{position:absolute;right:-2px;bottom:-4px;display:grid;place-items:center;min-width:47px;height:21px;padding:0 6px;border:2px solid white;border-radius:10px;background:#245e4c;color:white;font-size:10px;font-weight:700;white-space:nowrap}
.ai-desk-bubble{position:relative;flex:none;width:auto;margin:0;padding:6px 30px 6px 10px;border:1px solid #b9cdbd;border-radius:10px;background:white;box-shadow:0 3px 10px #17382f22}
.ai-desk-bubble p{margin:0;font-size:12px;line-height:20px;white-space:nowrap;overflow-wrap:normal}
.ai-desk [data-close]{position:absolute;top:3px;right:3px;display:grid;place-items:center;width:24px;height:24px;padding:0;border:0;background:transparent;color:#17382f;font-size:20px;line-height:1}
.ai-desk-ring{position:fixed;z-index:29;border:2px solid #658831;border-radius:7px;box-shadow:0 0 0 2px #c5f45b44;pointer-events:none;background:transparent}
.ai-desk-live{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* 近く・右下・公開ページとも一行と×だけ。閉じた入口は維持する。 */
.ai-desk:has(.ai-desk-bubble:not([hidden])){align-items:center}
@media(max-width:600px){
 .ai-desk{align-items:center;gap:6px;max-width:100vw;padding:6px 8px;opacity:1;z-index:100}
 .ai-desk-character{width:70px}
 .ai-desk-hint{align-self:flex-end;margin-right:0}
 .ai-desk-toggle{width:70px;height:70px}
 .ai-desk-toggle img{width:66px;height:66px}
 .ai-desk-toggle span{min-width:32px;height:16px;bottom:0;right:0;font-size:8px}
 .ai-desk-bubble{padding:6px 28px 6px 8px}
 .ai-desk-bubble p{font-size:11px}
}
/* 下は上向き、右は左向き、上は下向き。尾は実ボタン中央を指す。 */
.ai-desk[data-placement="target"]::after{content:"";position:absolute;left:calc(var(--ai-desk-tail-left) - 6px);top:calc(var(--ai-desk-bubble-bottom) - 6px);width:12px;height:12px;background:white;border-right:1px solid #b9cdbd;border-bottom:1px solid #b9cdbd;transform:rotate(45deg);pointer-events:none}
.ai-desk[data-placement="target"][data-side="below"]::after{top:calc(var(--ai-desk-bubble-top) - 7px);bottom:auto;border:0;border-top:1px solid #b9cdbd;border-left:1px solid #b9cdbd}
.ai-desk[data-placement="target"][data-side="right"]::after{left:-7px;top:calc(var(--ai-desk-tail-top) - 6px);bottom:auto;border:0;border-left:1px solid #b9cdbd;border-bottom:1px solid #b9cdbd}
@media(prefers-reduced-motion:reduce){.ai-desk,.ai-desk *,.ai-desk-ring{animation:none!important;transition:none!important;scroll-behavior:auto!important}}