.home-chat-avatar--event {background: linear-gradient(135deg, #2563eb, #3b82f6)}
.home-chat-bubble--event {border-color: rgba(37, 99, 235, 0.2);background: rgba(235, 245, 255, 0.95)}
.home-chat-tag--event {background: linear-gradient(135deg, #2563eb, #3b82f6)}
.home-chat-event-title {color: #0984e3;font-weight: 600}
.home-chat-msg--event {position: sticky;top: 0;z-index: 1}
turbo-frame#chat-feed-frame {display: block;position: absolute;inset: 0;pointer-events: none}
.home-chat {position: absolute;bottom: 30px;left: 0;right: auto;max-width: 85%;z-index: calc(var(--z-index-base) + 1);pointer-events: none}
.home-chat--hidden {display: none}
.home-chat-inner {padding: 0 12px;pointer-events: auto}
.home-chat-toggle {display: flex;align-items: center;gap: 6px;margin-left: 0;margin-bottom: 8px;padding: 6px 14px;background: rgba(255, 255, 255, 0.92);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);border: 1px solid rgba(0, 0, 0, 0.08);border-radius: 20px;font-size: 13px;font-weight: 600;color: #2d3436;cursor: pointer;box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);transition: all 0.2s}
.home-chat-toggle:hover {background: rgba(255, 255, 255, 1);box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15)}
.home-chat-toggle[aria-expanded="true"] {display: none}
.home-chat--switching .home-chat-toggle {display: none}
.home-chat-toggle-icon {width: 22px;height: 22px;border-radius: 50%;background: linear-gradient(135deg, #0984e3, #6c5ce7);display: flex;align-items: center;justify-content: center;color: #fff;font-size: 11px}
.home-chat-messages {display: flex;flex-direction: column;gap: 8px;max-height: 300px;overflow-y: auto;padding: 12px 0;-webkit-mask-image: linear-gradient(to bottom, black 0%, black 88%, transparent 100%);mask-image: linear-gradient(to bottom, black 0%, black 88%, transparent 100%);scrollbar-width: thin;scrollbar-color: rgba(0, 0, 0, 0.15) transparent}
.home-chat-messages.home-chat-messages--scrolled {-webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 12%, black 88%, transparent 100%);mask-image: linear-gradient(to bottom, transparent 0%, black 12%, black 88%, transparent 100%)}
.home-chat-messages.home-chat-messages--scrolled-bottom {-webkit-mask-image: linear-gradient(to bottom, black 0%, black 100%);mask-image: linear-gradient(to bottom, black 0%, black 100%)}
.home-chat-messages.home-chat-messages--scrolled.home-chat-messages--scrolled-bottom {-webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 12%, black 100%);mask-image: linear-gradient(to bottom, transparent 0%, black 12%, black 100%)}
.home-chat-messages::-webkit-scrollbar { width: 4px; }
.home-chat-messages::-webkit-scrollbar-track { background: transparent; }
.home-chat-messages::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.15); border-radius: 2px; }
.home-chat-messages--collapsed {display: none}
.home-chat-messages--hidden {display: none !important}
.home-chat-messages--fade-in {animation: homeChatFadeIn 0.3s ease-out forwards}
.home-chat-messages--fade-out {animation: homeChatFadeOut 0.2s ease-in forwards}
@keyframes homeChatFadeIn {from {opacity: 0;transform: translateY(8px)}
to {opacity: 1;transform: translateY(0)}}
@keyframes homeChatFadeOut {from {opacity: 1;transform: translateY(0)}
to {opacity: 0;transform: translateY(-8px)}}
.home-chat-msg {display: flex;align-items: flex-start;animation: homeChatSlideIn 0.35s ease-out;position: relative;padding-left: 20px}
@keyframes homeChatSlideIn {from { opacity: 0; transform: translateY(12px); }
to { opacity: 1; transform: translateY(0); }}
.home-chat-avatar {width: 32px;height: 32px;border-radius: 50%;flex-shrink: 0;display: flex;align-items: center;justify-content: center;font-size: 14px;color: #fff;box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);overflow: hidden;position: relative;z-index: 1;margin-right: -12px;border: 2px solid #fff}
.home-chat-avatar-img {width: 100%;height: 100%;max-width: 100%;box-sizing: border-box;object-fit: cover}
.home-chat-avatar--release { background: linear-gradient(135deg, #00b894, #00cec9); }
.home-chat-avatar--support { background: linear-gradient(135deg, #f9ca24, #f0932b); }
.home-chat-avatar--welcome { background: linear-gradient(135deg, #fd79a8, #a29bfe); }
.home-chat-avatar--beginner { background: #f5f6fa; }
.home-chat-avatar--guide { background: linear-gradient(135deg, #a0a0a0, #787878); }
.home-chat-avatar--ship-new { background: linear-gradient(135deg, #3b82f6, #2563eb); }
.home-chat-avatar--ship-schedule { background: linear-gradient(135deg, #0ea5e9, #0284c7); }
.home-chat-avatar--ship-reservation { background: linear-gradient(135deg, #10b981, #059669); }
.home-chat-avatar--article { background: linear-gradient(135deg, #8b5cf6, #6d28d9); }
.home-chat-beginner-icon {width: 18px;height: 18px}
.home-chat-admin-icon {width: 32px;height: 32px;border-radius: 50%;object-fit: cover}
.home-chat-bubble {background: rgba(255, 255, 255, 0.92);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);border: 1px solid rgba(0, 0, 0, 0.06);border-radius: 14px;padding: 10px 14px 10px 22px;font-size: 13px;line-height: 1.55;color: #2d3436;box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);flex: 1;min-width: 0;overflow-wrap: anywhere}
.home-chat-bubble--release {border-color: rgba(0, 184, 148, 0.2);background: rgba(240, 255, 250, 0.95)}
.home-chat-bubble--support {border-color: rgba(249, 202, 36, 0.3);background: rgba(255, 251, 240, 0.95)}
.home-chat-bubble--guide {border-color: rgba(120, 120, 120, 0.15);background: rgba(245, 245, 245, 0.95)}
.home-chat-bubble-title {font-size: 11px;font-weight: 700;color: #636e72;margin-bottom: 3px;display: flex;align-items: center;gap: 4px;flex-wrap: nowrap}
.home-chat-bubble-title .home-chat-tag {font-size: 10px;font-weight: 600;padding: 1px 6px;border-radius: 8px;color: #fff}
.home-chat-tag--catch { background: linear-gradient(135deg, #0984e3, #00b894); }
.home-chat-tag--cuisine { background: linear-gradient(135deg, #e17055, #fdcb6e); }
.home-chat-tag--release { background: linear-gradient(135deg, #00b894, #00cec9); }
.home-chat-tag--support { background: linear-gradient(135deg, #f9ca24, #f0932b); }
.home-chat-tag--welcome { background: linear-gradient(135deg, #fd79a8, #a29bfe); }
.home-chat-tag--guide { background: linear-gradient(135deg, #a0a0a0, #787878); }
.home-chat-tag--ship-new { background: linear-gradient(135deg, #3b82f6, #2563eb); }
.home-chat-tag--ship-schedule { background: linear-gradient(135deg, #0ea5e9, #0284c7); }
.home-chat-tag--ship-reservation { background: linear-gradient(135deg, #10b981, #059669); }
.home-chat-tag--article { background: linear-gradient(135deg, #8b5cf6, #6d28d9); }
.home-chat-bubble-text {font-size: 13px;color: #2d3436}
.home-chat-bubble-text a {color: #0984e3;text-decoration: none;font-weight: 600}
.home-chat-bubble-time {font-size: 10px;color: #b2bec3;margin-left: auto;white-space: nowrap}
.home-chat-link-subtle {font-size: 11px;color: #b2bec3;text-decoration: none;transition: color 0.2s}
.home-chat-link-subtle:hover { color: #636e72; }
.home-chat-bubble-text .home-chat-link-subtle { color: #b2bec3; font-weight: 400; }
.home-chat-bubble-text .home-chat-link-subtle:hover { color: #636e72; }
.home-chat-link-subtle .fa-chevron-right {font-size: 9px;margin-left: 2px}
@media (min-width: 769px) {.home-chat {bottom: 20px;left: 50%;right: auto;transform: translateX(-50%);max-width: 1200px;width: 90%}
.home-chat-inner {max-width: 100%;margin: 0;padding: 0}}