.staff-chat { position:fixed; right:20px; bottom:20px; z-index:1200; font-family:Inter,system-ui,sans-serif; }
.staff-chat [hidden] { display:none !important; }
.staff-chat-launch { position:relative; display:grid; place-items:center; width:54px; height:54px; padding:0; border:1px solid #075e9e; border-radius:50%; background:#0877c7; color:#fff; box-shadow:0 6px 18px #19384b35; cursor:pointer; }
.staff-chat-launch:hover { background:#0869ac; }
.staff-chat-launch:focus-visible,.staff-chat button:focus-visible,.staff-chat textarea:focus-visible { outline:2px solid #0877c7; outline-offset:2px; }
.staff-chat-launch-icon { position:relative; width:23px; height:17px; border:2px solid currentColor; border-radius:5px; }
.staff-chat-launch-icon::after { content:""; position:absolute; left:3px; bottom:-6px; width:7px; height:7px; border-left:2px solid currentColor; transform:skewY(-40deg); }
.staff-chat-unread { position:absolute; top:-6px; right:-6px; display:grid; place-items:center; min-width:20px; height:20px; padding:0 3px; border:2px solid #fff; border-radius:12px; background:#de3b37; color:#fff; font-size:10px; font-weight:800; line-height:1; font-variant-numeric:tabular-nums; }
.staff-chat-launch.has-unread .staff-chat-launch-icon,.staff-chat-launch.has-unread .staff-chat-unread { animation:staff-chat-blink 1.2s steps(2,start) infinite; }
@keyframes staff-chat-blink { 50% { opacity:.12; } }
@media(prefers-reduced-motion:reduce) { .staff-chat-launch.has-unread .staff-chat-launch-icon,.staff-chat-launch.has-unread .staff-chat-unread { animation:none; } }
.staff-chat-panel { position:absolute; right:0; bottom:66px; display:flex; flex-direction:column; width:min(390px,calc(100vw - 24px)); height:min(560px,calc(100dvh - 100px)); min-height:280px; overflow:hidden; border:1px solid #cad9e5; border-radius:8px; background:#fff; color:#1e3445; box-shadow:0 14px 42px #152f4540; }
.staff-chat-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border-bottom:1px solid #dbe6ed; background:#f4f9fc; }
.staff-chat-header div { display:grid; gap:2px; min-width:0; }
.staff-chat-header strong { font-size:15px; }
.staff-chat-header small { color:#627789; font-size:11px; }
.staff-chat-close { display:grid; place-items:center; flex:none; width:30px; height:30px; padding:0; border:1px solid #c7d8e4; border-radius:5px; background:#fff; color:#31556f; font-size:21px; font-weight:400; line-height:1; cursor:pointer; }
.staff-chat-older { align-self:center; width:auto; margin:8px; padding:5px 10px; border:1px solid #bdd4e6; border-radius:5px; background:#f6fbff; color:#155b8d; font-size:11px; cursor:pointer; }
.staff-chat-messages { flex:1; min-height:0; overflow-y:auto; padding:12px; }
.staff-chat-message { max-width:88%; margin:0 0 10px; padding:8px 10px; border:1px solid #dbe5eb; border-radius:6px; background:#f3f6f8; overflow-wrap:anywhere; }
.staff-chat-message.is-mine { margin-left:auto; border-color:#b8d9ec; background:#eaf6ff; }
.staff-chat-message-head { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:2px 8px; margin-bottom:3px; }
.staff-chat-message-head strong { font-size:11px; color:#185984; }
.staff-chat-message-head time { margin-left:auto; color:#6c7d89; font-size:10px; }
.staff-chat-reply-action { display:grid; place-items:center; flex:none; width:23px; height:23px; margin:-4px -3px -2px 0; padding:0; border:0; border-radius:4px; background:transparent; color:#35729a; font-size:17px; font-weight:600; cursor:pointer; }
.staff-chat-reply-action:hover { background:#dcecf6; }
.staff-chat-message p { margin:0; color:#243a49; font-size:12px; line-height:1.4; white-space:pre-wrap; }
.staff-chat-quote { max-height:110px; overflow-y:auto; margin:5px 0 8px; padding:6px 8px; border-left:3px solid #6da8cc; border-radius:3px; background:#fff; }
.staff-chat-quote strong { display:block; margin-bottom:3px; color:#306584; font-size:10px; }
.staff-chat-quote p { color:#506777; font-size:11px; }
.staff-chat-empty { margin:20px 8px; color:#697e8e; font-size:12px; text-align:center; }
.staff-chat-status { margin:0; padding:6px 12px; color:#9d2f2f; background:#fff1f1; font-size:11px; }
.staff-chat-reply { padding:7px 12px; border-top:1px solid #dbe6ed; background:#f1f8fc; }
.staff-chat-reply>div { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.staff-chat-reply strong { min-width:0; color:#1b6089; font-size:11px; }
.staff-chat-reply p { max-height:54px; overflow-y:auto; margin:4px 0 0; color:#40596a; font-size:11px; line-height:1.35; white-space:pre-wrap; overflow-wrap:anywhere; }
.staff-chat-reply button { display:grid; place-items:center; flex:none; width:22px; height:22px; padding:0; border:0; border-radius:4px; background:transparent; color:#426176; font-size:17px; cursor:pointer; }
.staff-chat-reply button:hover { background:#dcecf6; }
.staff-chat-form { position:relative; padding:10px 12px 12px; border-top:1px solid #dbe6ed; background:#fff; }
.staff-chat-form label { display:block; margin-bottom:5px; color:#4b6577; font-size:11px; font-weight:700; }
.staff-chat-form-row { display:flex; align-items:end; gap:7px; }
.staff-chat-form textarea { flex:1; min-width:0; max-height:110px; resize:vertical; padding:8px; border:1px solid #bfd0dc; border-radius:5px; color:#1d3546; font:12px/1.4 Inter,system-ui,sans-serif; }
.staff-chat-form button { flex:none; min-height:35px; padding:0 11px; border-radius:5px; background:#0877c7; color:#fff; font-size:11px; cursor:pointer; }
.staff-chat-form button:hover { background:#0869ac; }
.staff-chat-form .staff-chat-emoji-toggle { display:grid; place-items:center; width:35px; height:35px; padding:0; border:1px solid #bfd0dc; background:#f5f9fc; color:#285b7a; font-size:20px; font-weight:400; }
.staff-chat-form .staff-chat-emoji-toggle:hover { background:#e6f2f9; }
.staff-chat-emojis { position:absolute; right:66px; bottom:calc(100% - 1px); display:grid; grid-template-columns:repeat(6,1fr); gap:4px; width:246px; padding:8px; border:1px solid #c6d8e4; border-radius:6px; background:#fff; box-shadow:0 9px 24px #16334a29; }
.staff-chat-emojis button { display:grid; place-items:center; width:35px; height:35px; padding:0; border:0; background:#fff; font-size:19px; }
.staff-chat-emojis button:hover { background:#e6f2f9; }
@media(max-width:600px) { .staff-chat { right:12px; bottom:12px; }.staff-chat-panel { bottom:62px; height:min(520px,calc(100dvh - 86px)); } }
@media print { .staff-chat { display:none !important; } }