/* v2-chat.css — 개편 전 style.css에서 김비서 채팅·런처에 적용되던 규칙을 브라우저로 전부 추출 (2026-09-27 재생성). 원본 색 유지 */
.chancebot,.chat-widget{--bg:#0B0F19;--surface:#111827;--surface-2:#1F2937;--border:#263042;--text:#E5E7EB;--muted:#9CA3AF;--primary:#38BDF8;--primary-strong:#0EA5E9;--accent:#FACC15;--accent-strong:#EAB308;--success:#4ADE80;--danger:#F87171}
@keyframes spray-stance { 
  0% { transform: translateY(0px) rotate(0deg); }
  25% { transform: translateY(-6px) rotate(-10deg); }
  55% { transform: translateY(-3px) rotate(-6deg); }
  100% { transform: translateY(0px) rotate(0deg); }
}
@keyframes bot-bob { 
  0%, 100% { transform: translateY(0px) rotate(-1deg); }
  50% { transform: translateY(-3px) rotate(1deg); }
}
@keyframes bot-ping { 
  0%, 100% { box-shadow: rgba(74, 222, 128, 0.7) 0px 0px 0px 0px; }
  50% { box-shadow: rgba(74, 222, 128, 0) 0px 0px 0px 10px; }
}
@keyframes chat-in { 
  0% { opacity: 0; transform: translateY(20px) scale(0.95); }
  100% { opacity: 1; transform: translateY(0px) scale(1); }
}
@keyframes type-dot { 
  0%, 70%, 100% { opacity: 0.3; transform: translateY(0px); }
  35% { opacity: 1; transform: translateY(-3px); }
}
@keyframes erpPulse { 
  0%, 100% { box-shadow: rgba(52, 211, 153, 0.16) 0px 0px 0px 4px; }
  50% { box-shadow: rgba(52, 211, 153, 0.06) 0px 0px 0px 7px; }
}
.chat-widget a,.chancebot a{color: inherit; text-decoration: none;}
.chat-widget :focus-visible,.chancebot :focus-visible{outline: 3px solid var(--primary); outline-offset: 2px; border-radius: 4px;}
.chancebot.dragging{transition: none !important;}
.chancebot.dragging .chancebot-toggle{cursor: grabbing;}
.chancebot.teleporting{transition: right 0.55s cubic-bezier(0.2, 1, 0.3, 1), bottom 0.5s cubic-bezier(0.2, 1, 0.3, 1), left 0.55s cubic-bezier(0.2, 1, 0.3, 1), top 0.5s cubic-bezier(0.2, 1, 0.3, 1) !important;}
.chancebot.spraying .chancebot-toggle{animation: 0.8s ease-out 0s 1 normal none running spray-stance;}
.chancebot{position: fixed; right: 20px; bottom: 20px; z-index: 80; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; pointer-events: none; transition: right 4s cubic-bezier(0.25, 0.8, 0.3, 1), bottom 3s cubic-bezier(0.25, 0.8, 0.3, 1), left 4s cubic-bezier(0.25, 0.8, 0.3, 1), top 3s cubic-bezier(0.25, 0.8, 0.3, 1);}
.chancebot.walking #chancebotCanvas{animation: 0.4s ease-in-out 0s infinite normal none running bot-bob;}
.chancebot > *{pointer-events: auto;}
.chancebot-toggle{position: relative; width: 176px; height: 216px; padding: 0px; border: 0px; background: transparent; cursor: pointer; transition: transform 0.2s ease-out;}
.chancebot-toggle:hover{transform: scale(1.06) translateY(-2px);}
.chancebot-toggle:active{transform: scale(0.98);}
#chancebotCanvas{width: 100%; height: 100%; display: block; filter: drop-shadow(rgba(14, 165, 233, 0.35) 0px 10px 20px);}
.chancebot-ping{position: absolute; top: 14px; right: 14px; width: 14px; height: 14px; border-radius: 50%; background: rgb(74, 222, 128); border: 2px solid rgb(10, 17, 30); animation: 2s ease-in-out 0s infinite normal none running bot-ping;}
.chancebot-bubble{position: relative; padding: 0.9rem 1.1rem; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; font-size: 0.88rem; max-width: 240px; opacity: 0; transform: translateY(8px) scale(0.96); transition: opacity 0.35s, transform 0.35s; pointer-events: none; box-shadow: rgba(0, 0, 0, 0.4) 0px 10px 30px;}
.chancebot-bubble.show{opacity: 1; transform: translateY(0px) scale(1);}
.chancebot-bubble p{margin: 0px; line-height: 1.5;}
.chancebot-bubble p + p{margin-top: 0.3rem; color: var(--muted); font-size: 0.82rem;}
.chancebot-bubble::after{content: ""; position: absolute; right: 42px; bottom: -7px; width: 14px; height: 14px; background: var(--surface); border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); transform: rotate(45deg);}
.chat-widget[hidden]{display: none !important;}
.chat-widget{position: fixed; bottom: 200px; right: 20px; width: min(460px, -40px + 100vw); height: 660px; max-height: calc(-240px + 100vh); background: var(--surface); border: 1px solid var(--border); border-radius: 20px; box-shadow: rgba(0, 0, 0, 0.55) 0px 30px 80px; z-index: 82; display: flex; flex-direction: column; overflow: hidden; animation: 0.3s cubic-bezier(0.22, 1, 0.36, 1) 0s 1 normal none running chat-in;}
.chat-head{display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.2rem; background: linear-gradient(135deg, rgba(56, 189, 248, 0.16), rgba(250, 204, 21, 0.06)); border-bottom: 1px solid var(--border);}
.chat-head-left{display: flex; align-items: center; gap: 0.75rem;}
.chat-avatar{width: 42px; height: 42px; border-radius: 50%; background: radial-gradient(circle at 30% 30%, rgb(74, 85, 104) 0%, rgb(34, 38, 51) 70%); border: 2px solid rgba(56, 189, 248, 0.5); position: relative;}
.chat-avatar::before,.chat-avatar::after{content: ""; position: absolute; width: 6px; height: 6px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 6px var(--primary); top: 15px;}
.chat-avatar::before{left: 11px;}
.chat-avatar::after{right: 11px;}
.chat-head strong{display: block; font-size: 1rem; font-weight: 800;}
.chat-head small{color: var(--muted); font-size: 0.78rem; display: flex; align-items: center; gap: 0.3rem;}
.chat-dot{display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: rgb(74, 222, 128); box-shadow: rgb(74, 222, 128) 0px 0px 6px;}
.chat-close{width: 34px; height: 34px; background: transparent; border: 0px; color: var(--muted); font-size: 1.6rem; line-height: 1; cursor: pointer; border-radius: 10px; transition: background 0.2s, color 0.2s;}
.chat-close:hover{background: rgba(255, 255, 255, 0.06); color: var(--text);}
.chat-body{flex: 1 1 0%; overflow-y: auto; padding: 1rem 1.2rem; display: flex; flex-direction: column; gap: 0.55rem; scrollbar-width: thin; scrollbar-color: var(--border) transparent;}
.chat-widget .msg,.chancebot .msg{max-width: 85%; padding: 0.7rem 0.95rem; border-radius: 14px; font-size: 0.93rem; line-height: 1.5; word-break: break-word; overflow-wrap: anywhere; white-space: pre-wrap; hyphens: auto;}
.chat-widget .msg-bot,.chancebot .msg-bot{background: var(--surface-2); color: var(--text); align-self: flex-start; border-bottom-left-radius: 4px;}
.msg-typing{align-self: flex-start; display: flex; gap: 5px; padding: 0.85rem 1rem; background: var(--surface-2); border-radius: 14px 14px 14px 4px;}
.msg-typing span{width: 7px; height: 7px; border-radius: 50%; background: var(--muted); animation: 1.2s ease-in-out 0s infinite normal none running type-dot;}
.msg-typing span:nth-child(2){animation-delay: 0.15s;}
.msg-typing span:nth-child(3){animation-delay: 0.3s;}
.chat-quick{display: flex; flex-wrap: wrap; gap: 0.4rem; padding: 0.7rem 1rem; border-top: 1px solid var(--border);}
.chat-quick button{padding: 0.45rem 0.85rem; border-radius: 999px; border: 1px solid var(--border); background: transparent; color: var(--text); font-size: 0.82rem; cursor: pointer; transition: 0.2s; font-family: inherit;}
.chat-quick button:hover{border-color: var(--primary); background: rgba(56, 189, 248, 0.1); color: var(--primary);}
.chat-link{color: var(--primary); text-decoration: underline; word-break: break-all;}
.chat-link:hover{color: var(--accent);}
.chat-handoff-btn{display: block; width: calc(100% - 2rem); margin: 0px 1rem 0.2rem; padding: 0.55rem 0.9rem; border-radius: 10px; border: 0px; background: linear-gradient(135deg, var(--primary), var(--accent)); color: rgb(0, 16, 24); font-size: 0.85rem; font-weight: 700; cursor: pointer; font-family: inherit; transition: transform 0.15s, filter 0.15s;}
.chat-handoff-btn:hover{transform: translateY(-1px); filter: brightness(1.08);}
.chat-handoff-btn:active{transform: translateY(0px);}
.chat-form{display: flex; gap: 0.5rem; padding: 0.75rem 1rem; border-top: 1px solid var(--border);}
.chat-form input{flex: 1 1 0%; padding: 0.7rem 0.95rem; background: rgb(10, 17, 30); border: 1px solid var(--border); border-radius: 12px; color: var(--text); font-size: 16px; font-family: inherit;}
.chat-form input:focus{outline: none; border-color: var(--primary); background: rgb(10, 22, 40);}
.chat-form button[type="submit"]{width: 46px; height: 46px; border-radius: 50%; border: 0px; background: var(--primary); color: rgb(0, 16, 24); font-size: 1.3rem; font-weight: 700; cursor: pointer; transition: background 0.2s, transform 0.15s;}
.chat-form button[type="submit"]:hover{background: var(--accent); transform: scale(1.05);}
.kb-hero{max-width: 440px; margin: 0px auto; background: linear-gradient(rgba(20, 28, 45, 0.92), rgba(11, 15, 25, 0.94)); border: 1px solid rgba(56, 189, 248, 0.25); border-radius: 24px; padding: 22px; box-shadow: rgba(0, 0, 0, 0.45) 0px 30px 80px; backdrop-filter: blur(12px);}
.kb-hero-head{display: flex; align-items: center; gap: 12px; margin-bottom: 14px;}
.kb-hero-avatar{width: 56px; height: 56px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(56, 189, 248, 0.5); box-shadow: rgba(0, 0, 0, 0.35) 0px 8px 20px;}
.kb-hero-id b{display: block; font-size: 16.5px; font-weight: 900; color: rgb(241, 245, 249);}
.kb-hero-id small{display: flex; align-items: center; gap: 6px; color: rgb(148, 163, 184); font-size: 12px; font-weight: 600; margin-top: 2px;}
.kb-dot{width: 8px; height: 8px; border-radius: 50%; background: rgb(52, 211, 153); box-shadow: rgba(52, 211, 153, 0.16) 0px 0px 0px 4px; animation: 2s ease 0s infinite normal none running erpPulse;}
.kb-hero-bubble{background: rgba(56, 189, 248, 0.09); border: 1px solid rgba(56, 189, 248, 0.2); border-radius: 4px 16px 16px; padding: 14px 16px; color: rgb(226, 232, 240); font-size: 14.5px; line-height: 1.65; font-weight: 500;}
.kb-hero-bubble b{color: rgb(125, 211, 252);}
.kb-hero-chips{display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px;}
.kb-hero-chips button{background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 11px; color: rgb(203, 213, 225); font-size: 13px; font-weight: 700; padding: 11px 10px; cursor: pointer; transition: border-color 0.2s, background 0.2s; font-family: inherit;}
.kb-hero-chips button:hover{border-color: rgba(56, 189, 248, 0.5); background: rgba(56, 189, 248, 0.1); color: rgb(255, 255, 255);}
.kb-hero-form{display: flex; gap: 8px; margin-top: 12px;}
.kb-hero-form input{flex: 1 1 0%; background: rgba(255, 255, 255, 0.06); border: 1.5px solid rgba(255, 255, 255, 0.15); border-radius: 12px; padding: 12px 14px; color: rgb(241, 245, 249); font-size: 14px; font-family: inherit;}
.kb-hero-form input:focus{outline: none; border-color: rgb(56, 189, 248);}
.kb-hero-form button{width: 46px; border: 0px; border-radius: 12px; background: linear-gradient(135deg, rgb(56, 189, 248), rgb(37, 99, 235)); color: rgb(255, 255, 255); font-size: 18px; font-weight: 900; cursor: pointer;}
.kb-hero-note{margin: 10px 2px 0px; color: rgb(100, 116, 139); font-size: 11.5px; font-weight: 600;}
body.kb-hero-mode .chancebot{opacity: 0; pointer-events: none; transform: translateY(24px) scale(0.9); transition: opacity 0.4s, transform 0.4s;}
.chancebot{transition: opacity 0.4s, transform 0.4s;}
.chat-widget{background: url("/images/secretary/hello.jpg") 82% 12% / cover no-repeat rgb(223, 231, 240); border: 1px solid rgba(15, 23, 42, 0.12);}
.chat-widget.kb-idle{background-image: url("/images/secretary/idle.jpg");}
.chat-widget.kb-thinking{background-image: url("/images/secretary/thinking.jpg");}
.chat-widget::after{content: ""; position: absolute; inset: 0px; border-radius: inherit; pointer-events: none; background: linear-gradient(rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0) 22%, rgba(255, 255, 255, 0) 62%, rgba(255, 255, 255, 0.55) 100%);}
.chat-widget > *{position: relative; z-index: 1;}
.chat-head{background: rgba(255, 255, 255, 0.66); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(15, 23, 42, 0.08);}
.chat-head strong{color: rgb(22, 32, 44);}
.chat-head small{color: rgb(91, 107, 124);}
.chat-close{color: rgb(66, 80, 107);}
.chat-avatar{background: url("/images/secretary/hello.jpg") 62% 18% / 220% auto no-repeat; border: 2px solid rgb(255, 255, 255); box-shadow: rgba(15, 23, 42, 0.18) 0px 4px 12px;}
.chat-avatar::before,.chat-avatar::after{display: none;}
.chat-body{scrollbar-color: rgba(15, 23, 42, 0.2) transparent;}
.chat-widget .msg-bot,.chancebot .msg-bot{background: rgba(255, 255, 255, 0.94); color: rgb(29, 39, 51); box-shadow: rgba(15, 23, 42, 0.14) 0px 6px 18px; border: 1px solid rgba(15, 23, 42, 0.05);}
.chat-quick{background: rgba(255, 255, 255, 0.68); backdrop-filter: blur(8px); border-top: 1px solid rgba(15, 23, 42, 0.06);}
.chat-quick button{background: rgb(255, 255, 255); border: 1px solid rgba(15, 23, 42, 0.14); color: rgb(42, 58, 77); box-shadow: rgba(15, 23, 42, 0.08) 0px 2px 8px;}
.chat-quick button:hover{border-color: rgb(49, 130, 246); color: rgb(27, 100, 218); background: rgb(243, 248, 255);}
.chat-handoff-btn{background: linear-gradient(135deg, rgb(49, 130, 246), rgb(27, 100, 218)); color: rgb(255, 255, 255); border: 0px;}
.chat-form{background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(8px); border-top: 1px solid rgba(15, 23, 42, 0.06);}
.chat-form input{background: rgb(255, 255, 255); border: 1.5px solid rgba(15, 23, 42, 0.14); color: rgb(22, 32, 44); border-radius: 999px;}
.chat-form input::placeholder{color: rgb(139, 152, 168);}
.chat-form input:focus{border-color: rgb(49, 130, 246);}
.chat-form button[type="submit"]{background: rgb(49, 130, 246); color: rgb(255, 255, 255); border-radius: 50%;}
.chat-form button[type="submit"]:hover{background: rgb(27, 100, 218);}
.msg-bot .typing-dot,.typing i{background: rgb(49, 130, 246);}
.kb-dock{position: relative; max-width: 480px; margin: 0px auto; min-height: 620px;}
.kb-dock-skeleton{position: relative; height: 620px; border-radius: 20px; overflow: hidden; border: 1px solid rgba(15, 23, 42, 0.15); box-shadow: rgba(0, 0, 0, 0.45) 0px 30px 80px;}
.kb-dock-skeleton img{width: 100%; height: 100%; object-fit: cover; object-position: 68% 12%;}
.kb-dock-skeleton span{position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); background: rgba(255, 255, 255, 0.9); color: rgb(42, 58, 77); font-size: 12.5px; font-weight: 800; padding: 8px 14px; border-radius: 999px;}
.kb-dock-skeleton[hidden]{display: none;}
.chat-widget.kb-docked{position: static; width: 100%; max-width: 480px; height: 620px; max-height: none; margin: 0px auto; bottom: auto; right: auto; box-shadow: rgba(0, 0, 0, 0.5) 0px 30px 80px;}
.chat-widget.kb-docked .chat-close{display: none;}
body.kb-docked-page .chancebot{opacity: 0; pointer-events: none; transform: translateY(24px) scale(0.9);}
.chat-widget .chat-body{padding-right: 36%;}
.chat-widget .chat-body .msg{align-self: flex-start; max-width: 100%;}
.chat-widget .chat-body .msg-user{background: rgb(238, 244, 255); color: rgb(29, 39, 51); border: 1px solid rgba(49, 130, 246, 0.25);}
.chat-widget .chat-body .msg-user::before{content: "나 · "; font-weight: 800; color: rgb(49, 130, 246);}
.chat-widget .chat-head{position: absolute; top: 8px; right: 8px; left: auto; padding: 0px; z-index: 6; background: none !important; border: 0px !important; backdrop-filter: none !important;}
.chat-widget .chat-head-left{display: none;}
.chat-widget .chat-close{width: 34px; height: 34px; border-radius: 50%; background: rgba(15, 23, 42, 0.45); color: rgb(255, 255, 255); font-size: 19px; line-height: 1; display: flex; align-items: center; justify-content: center;}
.chat-widget .chat-body{padding-top: 1.1rem;}
#chatWidget #chatForm #chatInput,#chatWidget #chatForm #chatInput:hover,#chatWidget #chatForm #chatInput:focus,#chatWidget #chatForm #chatInput:active{appearance: none; background: none rgb(7, 19, 35); border: 1.5px solid rgba(56, 189, 248, 0.72); color: rgb(248, 250, 252); caret-color: rgb(56, 189, 248); box-shadow: rgba(0, 0, 0, 0.22) 0px 1px 3px inset; outline: none;}
#chatWidget #chatForm #chatInput:focus{border-color: rgb(56, 189, 248); box-shadow: rgba(56, 189, 248, 0.13) 0px 0px 0px 3px, rgba(0, 0, 0, 0.22) 0px 1px 3px inset;}
#chatWidget #chatForm #chatInput::placeholder{color: rgb(129, 144, 164); opacity: 1;}
#chatWidget #chatForm #chatInput:-webkit-autofill,#chatWidget #chatForm #chatInput:-webkit-autofill:hover,#chatWidget #chatForm #chatInput:-webkit-autofill:focus{-webkit-text-fill-color: rgb(248, 250, 252); box-shadow: rgb(7, 19, 35) 0px 0px 0px 1000px inset; caret-color: rgb(56, 189, 248);}
@media (max-width: 560px){
.chancebot{right: 14px; bottom: 14px;}
.chancebot-toggle{width: 132px; height: 160px;}
.chancebot-bubble{max-width: 200px; font-size: 0.82rem;}
.chat-widget{inset: 0px; width: 100%; height: 100dvh; max-height: 100dvh; border-radius: 0px; border: 0px; z-index: 9999; padding-top: env(safe-area-inset-top);}
.chat-head{padding: 0.9rem 1rem; position: sticky; top: 0px; background: linear-gradient(135deg, rgba(56, 189, 248, 0.18), rgba(11, 15, 25, 0.96)); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(255, 255, 255, 0.08); z-index: 2;}
.chat-close{width: 48px; height: 48px; font-size: 2rem; color: rgb(255, 255, 255); border: 1px solid rgba(255, 255, 255, 0.18); display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: rgba(255, 255, 255, 0.1) !important; border-radius: 50% !important;}
.chat-close:active{background: rgba(255, 255, 255, 0.2) !important;}
.chat-body{padding: 0.85rem 1rem;}
.chat-quick{padding: 0.55rem 0.8rem; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;}
.chat-quick::-webkit-scrollbar{display: none;}
.chat-quick button{flex-shrink: 0; font-size: 0.78rem; padding: 0.4rem 0.75rem;}
.chat-handoff-btn{width: calc(100% - 1.6rem); margin: 0px 0.8rem 0.15rem; padding: 0.5rem 0.8rem; font-size: 0.8rem;}
.chat-form{padding: .6rem .8rem calc(.6rem + env(safe-area-inset-bottom));}
.chat-form button[type="submit"]{width: 42px; height: 42px;}
}
@media (prefers-reduced-motion: reduce){
.chancebot{transition: none !important;}
}
@media (max-width: 480px){
.chancebot-toggle{width: 112px; height: 136px;}
.chancebot-bubble{display: none;}
}
@media (hover: none){
.erp-bot-card:hover{transform: none !important;}
}
@media (max-width: 760px){
.kb-dock{min-height: 540px;}
.kb-dock-skeleton{height: 540px;}
.chat-widget.kb-docked{height: 540px;}
.chat-widget .chat-body{padding-right: 30%;}
}
@media (max-width: 900px){
body.kb-mobile-chat-open{overflow: hidden; overscroll-behavior: none;}
body.kb-mobile-chat-open .chancebot{opacity: 0 !important; pointer-events: none !important;}
#chatWidget.chat-widget:not(.kb-docked){position: fixed !important; inset: 0px !important; width: 100vw !important; height: 100dvh !important; max-height: none !important; margin: 0px !important; border: 0px !important; border-radius: 0px !important; box-shadow: none !important; overflow: hidden !important; box-sizing: border-box !important; background-color: rgb(244, 247, 250) !important; background-position: 50% 8%, 50% 8% !important; background-size: 100% 47dvh, cover !important; background-repeat: no-repeat !important;}
#chatWidget.chat-widget:not(.kb-docked)::after{border-radius: 0px; background: linear-gradient(rgba(244, 247, 250, 0) 28%, rgba(244, 247, 250, 0.2) 36%, rgb(244, 247, 250) 49%, rgb(244, 247, 250) 100%);}
#chatWidget.chat-widget:not(.kb-docked) .chat-head{align-items: center; justify-content: space-between; z-index: 20; position: absolute !important; top: max(14px,env(safe-area-inset-top)) !important; right: 14px !important; left: 14px !important; width: auto !important; display: flex !important; padding: 0px !important; background: none !important; border: 0px !important;}
#chatWidget.chat-widget:not(.kb-docked) .chat-head-left{align-items: center; gap: 8px; min-height: 52px; padding: 6px 14px 6px 7px; border: 1px solid rgba(255, 255, 255, 0.82); border-radius: 999px; background: rgba(255, 255, 255, 0.9); box-shadow: rgba(15, 23, 42, 0.16) 0px 8px 24px; backdrop-filter: blur(12px); display: flex !important;}
#chatWidget.chat-widget:not(.kb-docked) .chat-head-left strong{display: block; color: rgb(23, 34, 49); font-size: 18px; line-height: 1;}
#chatWidget.chat-widget:not(.kb-docked) .chat-head-left small{display: none;}
#chatWidget.chat-widget:not(.kb-docked) .chat-avatar{width: 38px; height: 38px; flex: 0 0 38px;}
#chatWidget.chat-widget:not(.kb-docked) .chat-close{flex: 0 0 52px; backdrop-filter: blur(8px); position: fixed !important; top: max(14px,env(safe-area-inset-top)) !important; right: 14px !important; width: 52px !important; height: 52px !important; border: 1px solid rgba(255, 255, 255, 0.42) !important; border-radius: 50% !important; background: rgba(8, 15, 25, 0.68) !important; color: rgb(255, 255, 255) !important; font-size: 31px !important; font-weight: 300 !important; line-height: 1 !important; box-shadow: rgba(15, 23, 42, 0.22) 0px 8px 24px !important;}
#chatWidget.chat-widget:not(.kb-docked) .chat-close:active{transform: scale(0.96); background: rgba(3, 7, 18, 0.88) !important;}
#chatWidget.chat-widget:not(.kb-docked) .chat-body{min-height: 0px; scroll-padding-bottom: 120px; flex: 1 1 auto !important; margin-top: 37dvh !important; padding-top:  !important; padding-bottom:  !important; padding-left:  !important; padding-right: 18px !important; background: linear-gradient(rgba(244, 247, 250, 0), rgb(244, 247, 250) 70px) !important; box-sizing: border-box !important; width: 100% !important;}
#chatWidget.chat-widget:not(.kb-docked) .chat-body .msg{padding: 13px 15px; border-radius: 18px; font-size: 15px; line-height: 1.58; box-sizing: border-box; overflow-wrap: anywhere; max-width: calc(100% - 42px) !important;}
#chatWidget.chat-widget:not(.kb-docked) .chat-body .msg-bot{align-self: flex-start; margin-left: 34px; background: rgba(255, 255, 255, 0.96);}
#chatWidget.chat-widget:not(.kb-docked) .chat-body .msg-user{align-self: flex-end; margin-left: 42px; background: rgb(49, 130, 246); color: rgb(255, 255, 255); border: 0px;}
#chatWidget.chat-widget:not(.kb-docked) .chat-body .msg-user::before{color: rgb(220, 235, 255);}
#chatWidget.chat-widget:not(.kb-docked) .chat-quick{position: absolute; left: 0px; right: 0px; bottom: calc(78px + env(safe-area-inset-bottom)); z-index: 12; padding: 8px 14px; background: linear-gradient(rgba(244, 247, 250, 0), rgba(244, 247, 250, 0.96) 34%); border: 0px;}
#chatWidget.chat-widget:not(.kb-docked) .chat-form{z-index: 14; min-height: 78px; gap: 9px; box-shadow: rgba(15, 23, 42, 0.08) 0px -12px 30px; backdrop-filter: blur(16px); position: absolute !important; left: 0px !important; right: 0px !important; bottom: 0px !important; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)) !important; background: rgba(244, 247, 250, 0.94) !important; border-top: 1px solid rgba(15, 23, 42, 0.08) !important; width: 100% !important; box-sizing: border-box !important;}
#chatWidget.chat-widget:not(.kb-docked) #chatForm #chatInput{min-width: 0px; height: 54px; padding: 0px 20px; font-size: 16px; border-radius: 999px !important;}
#chatWidget.chat-widget:not(.kb-docked) .chat-form button[type="submit"]{width: 54px; height: 54px; flex: 0 0 54px; font-size: 24px; box-shadow: rgba(49, 130, 246, 0.28) 0px 8px 18px;}
}

/* v2: 모바일에서 김비서 런처를 작게, 말풍선 숨김 */
@media (max-width:640px){.chancebot{transform:scale(.62);transform-origin:right bottom}.chancebot-bubble{display:none!important}}

/* 말풍선 안 링크 (개편 전과 동일하게) */
.chat-widget .chat-body a{color:#2563eb!important;text-decoration:underline!important;overflow-wrap:anywhere!important}
.chat-widget .chat-body, .chat-widget .chat-body *{word-break:keep-all!important;overflow-wrap:break-word!important}
.chat-widget .chat-body a{overflow-wrap:anywhere!important}

/* 런처 말풍선: 밝은 사이트 톤 */
.chancebot-bubble{background:#fff!important;border-color:#e4e7ec!important;color:#0b1220!important;box-shadow:0 14px 34px -16px rgba(11,18,32,.35)!important}
.chancebot-bubble::after{background:#fff!important;border-color:#e4e7ec!important}
.chancebot-bubble p+p{color:#5b6573!important}
/* WebGL 미지원 기기: 3D 대신 사진 버튼 */
.chancebot-toggle.chancebot-nogl{width:68px;height:68px;border-radius:50%;background:#fff url(/images/kimbiseo-hello.jpg) 72% 22%/220% auto no-repeat;box-shadow:0 8px 24px -8px rgba(11,18,32,.35);border:3px solid #fff;margin:0 0 0 auto;display:block}
.chancebot-toggle.chancebot-nogl::after{content:"김비서";position:absolute;left:50%;bottom:-22px;transform:translateX(-50%);font-size:12px;font-weight:700;color:#0b1220;background:#fff;border-radius:999px;padding:2px 8px;box-shadow:0 2px 8px rgba(0,0,0,.12);white-space:nowrap}