/* Supplied KakaoTalk list, conversation and default profile references. */
.kakao-avatar { position: relative; display: block; overflow: hidden; flex-shrink: 0; width: 47px; height: 47px; background: transparent!important; border-radius: 0!important; -webkit-mask-image: url("assets/kakao/profile-mask.svg"); mask-image: url("assets/kakao/profile-mask.svg"); -webkit-mask-size: 100% 100%; mask-size: 100% 100%; }
.kakao-avatar>img { position: absolute; left: -33.333333%; width: 156.944444%; max-width: none; height: auto; display: block; }
.kakao-avatar-0>img { top: -17.361111%; }
.kakao-avatar-1>img { top: -292.361111%; }
.kakao-avatar-2>img { top: -429.861111%; }
.kakao-avatar-custom>img { inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kakao-group-avatar { position: relative; display: block; flex-shrink: 0; width: 47px; height: 47px; }
.kakao-group-avatar>.kakao-avatar { position: absolute; width: 47%; height: 47%; }
.kakao-group-avatar-3>.kakao-avatar:nth-child(1) { top: 0; left: 26.5%; }
.kakao-group-avatar-3>.kakao-avatar:nth-child(2) { bottom: 0; left: 0; }
.kakao-group-avatar-3>.kakao-avatar:nth-child(3) { bottom: 0; right: 0; }
.kakao-group-avatar-4>.kakao-avatar:nth-child(1) { top: 0; left: 0; }
.kakao-group-avatar-4>.kakao-avatar:nth-child(2) { top: 0; right: 0; }
.kakao-group-avatar-4>.kakao-avatar:nth-child(3) { bottom: 0; left: 0; }
.kakao-group-avatar-4>.kakao-avatar:nth-child(4) { bottom: 0; right: 0; }
.kakao-group-avatar-2>.kakao-avatar { width: 62%; height: 62%; }
.kakao-group-avatar-2>.kakao-avatar:nth-child(1) { top: 0; left: 0; }
.kakao-group-avatar-2>.kakao-avatar:nth-child(2) { bottom: 0; right: 0; }
.kakao-list-app { color: #18191a; background: #fff; padding-top: 58px; }
.kakao-list-app button:disabled,.kakao-chat button:disabled { opacity: 1; cursor: default; }
.kakao-list-header { display: flex; align-items: center; justify-content: space-between; min-height: 49px; padding: 6px 16px 4px; flex-shrink: 0; }
.kakao-list-header h1 { margin: 0; font-size: 22px; line-height: 29px; font-weight: 750; letter-spacing: -.7px; }
.kakao-list-header>div { display: flex; gap: 17px; align-items: center; }
.kakao-list-header button { display: grid; place-items: center; width: 24px; height: 32px; }
.kakao-list-header .icon { width: 23px; height: 23px; }
.kakao-filters { display: flex; gap: 6px; padding: 9px 16px 8px; flex-shrink: 0; overflow-x: auto; scrollbar-width: none; }
.kakao-filters::-webkit-scrollbar { display: none; }
.kakao-filters>button { display: flex; align-items: center; justify-content: center; gap: 5px; flex-shrink: 0; height: 38px; padding: 0 16px; border-radius: 22px; color: #5d5d60; background: #f2f2f2; font-size: 15px; line-height: 20px; font-weight: 700; letter-spacing: -.4px; white-space: nowrap; }
.kakao-filters>button.selected { background: #191a1b; color: #fff; }
.kakao-filters>button>span { display: grid; place-items: center; min-width: 29px; height: 17px; padding: 0 5px; border-radius: 10px; color: #fff; background: #ff521e; font-size: 11px; font-weight: 750; letter-spacing: 0; }
.kakao-filters>.kakao-filter-add { position: relative; width: 38px; padding: 0; }
.kakao-filter-add .icon { width: 23px; height: 23px; }
.kakao-filter-add i { position: absolute; top: 10px; right: 10px; width: 4px; height: 4px; background: #ff521e; border-radius: 50%; }
.kakao-list-scroll { padding-top: 4px; padding-bottom: 105px; }
.kakao-list-app .chat-list { padding: 0; }
.kakao-list-app .kakao-chat-row { width: 100%; display: flex; align-items: center; gap: 12px; min-height: 67px; padding: 9px 16px; border: 0; text-align: left; }
.kakao-list-app .kakao-chat-row>.kakao-avatar { width: 47px; height: 47px; }
.kakao-row-copy { display: block; min-width: 0; flex: 1; }
.kakao-row-copy>strong { display: block; margin-bottom: 4px; color: #18191a; font-size: 16px; line-height: 20px; letter-spacing: -.35px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kakao-participants { margin-left: 6px; color: #818181; font-weight: 650; }
.kakao-row-copy>strong.kakao-group-title { display: flex; align-items: baseline; }
.kakao-room-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kakao-group-title>.kakao-participants { flex-shrink: 0; }
.kakao-row-copy>p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 0; font-size: 14px; line-height: 20px; letter-spacing: -.4px; color: #818181; }
.kakao-row-meta { display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-start; gap: 5px; align-self: flex-start; min-width: 42px; padding-top: 6px; }
.kakao-row-meta>time { white-space: nowrap; color: #818181; font-size: 12px; line-height: 17px; font-weight: 500; letter-spacing: -.3px; }
.kakao-row-meta>.chat-count { position: static; display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 11px; color: #fff; background: #ff521e; font-size: 11px; font-weight: 700; line-height: 18px; }
.kakao-list-ad { display: flex; align-items: center; gap: 12px; min-height: 75px; padding: 11px 16px; }
.kakao-ad-image { display: grid; place-items: center; flex-shrink: 0; width: 47px; height: 47px; background: #ff692f; border-radius: 18px; }
.kakao-ad-image .icon { width: 29px; height: 29px; }
.kakao-ad-copy { display: block; min-width: 0; flex: 1; }
.kakao-ad-copy>strong { display: block; color: #18191a; font-size: 15px; line-height: 20px; font-weight: 700; letter-spacing: -.3px; }
.kakao-ad-copy>span { display: flex; align-items: center; gap: 4px; margin-top: 4px; color: #818181; font-size: 13px; line-height: 17px; }
.kakao-ad-copy small { display: grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; background: #f0f0f0; font-size: 9px; font-weight: 650; }
.kakao-list-ad>button { flex-shrink: 0; min-width: 67px; height: 34px; padding: 0 11px; border-radius: 22px; color: #505050; background: #f4f4f4; font-size: 13px; font-weight: 650; letter-spacing: -.35px; }
.kakao-tabs { position: absolute; z-index: 10; bottom: 0; left: 0; right: 0; display: flex; align-items: flex-start; justify-content: space-around; height: 82px; padding: 15px 12px 29px; border: 0; background: #fffffff5; }
.kakao-tabs>button { display: grid; place-items: center; flex: 1; min-width: 0; height: 30px; color: #b8bec2; }
.kakao-tabs>button.active { color: #303b41; }
.kakao-tabs>button>span { position: relative; display: block; }
.kakao-tabs .icon { width: 27px; height: 27px; }
.kakao-tabs b { position: absolute; top: -5px; left: 16px; display: grid; place-items: center; height: 17px; min-width: 28px; padding: 0 5px; border-radius: 12px; background: #ff521e; color: #fff; font-size: 11px; line-height: 17px; font-weight: 750; }
.kakao-tabs i { position: absolute; top: -4px; right: -2px; width: 5px; height: 5px; border-radius: 50%; background: #ff521e; }
.kakao-searchbar { display: flex; align-items: center; gap: 10px; padding: 0 16px 8px; flex-shrink: 0; }
.kakao-searchbar .search-field { margin: 0; min-width: 0; flex: 1; height: 37px; background: #f2f3f4; border-radius: 14px; box-shadow: none; }
.kakao-searchbar input { font-size: 15px; }
.kakao-searchbar>button { flex-shrink: 0; font-size: 14px; color: #555; padding: 5px 0; }
/* Rounded Kakao bubbles with curved tails and compact, grouped messages. */
.kakao-chat { color: #273c49; background: #adc3d1; padding-top: 0; }
.kakao-top-material { position: absolute; z-index: 7; top: 0; left: 0; right: 0; height: 136px; pointer-events: none; background: #adc3d124; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); mask-image: linear-gradient(#000 0%,#000 78%,transparent 100%); -webkit-mask-image: linear-gradient(#000 0%,#000 78%,transparent 100%); }
.kakao-chat .kakao-thread-header { position: absolute; top: 58px; left: 0; right: 0; z-index: 8; display: grid; grid-template-columns: 84px minmax(0,1fr) 84px; align-items: center; gap: 10px; min-height: 52px; padding: 0 16px 7px; border: 0; }
.kakao-glass { border: .9px solid #f5fbff; background: #e8f5ffc2; box-shadow: inset 0 1px 1px #fff,0 5px 25px #3c637007; backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); }
.kakao-back { display: flex; align-items: center; justify-content: center; justify-self: start; gap: 4px; width: max-content; min-width: 44px; max-width: 100%; height: 44px; padding: 0 10px; border-radius: 22px; font-size: 17px; font-weight: 650; color: #294656; }
.kakao-back .icon { width: 22px; height: 22px; }
.kakao-back>span { font-variant-numeric: tabular-nums; line-height: 1; }
.kakao-thread-title { display: flex; align-items: baseline; justify-content: center; gap: 5px; min-width: 0; max-width: 100%; overflow: hidden; white-space: nowrap; font-size: 17px; font-weight: 650; color: #141c20; letter-spacing: -.45px; }
.kakao-thread-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kakao-thread-count { flex-shrink: 0; color: #687780; font-size: 14px; font-weight: 500; letter-spacing: 0; }
.kakao-thread-tools { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 84px; height: 44px; padding: 0 10px; border-radius: 25px; }
.kakao-thread-tools button { display: grid; place-items: center; width: 25px; height: 35px; }
.kakao-thread-tools .icon { width: 22px; height: 22px; }
.kakao-chat .chat-bubbles { position: relative; z-index: 1; gap: 12px; padding: 119px 10px 125px; }
.kakao-chat .kakao-date-chip { display: flex; align-items: center; justify-content: center; gap: 4px; align-self: center; margin: 0 0 1px; padding: 5px 13px; color: #324854; background: #91acbc48; border-radius: 22px; font-size: 12px; font-weight: 600; line-height: 17px; letter-spacing: -.3px; }
.kakao-date-chip .icon { width: 11px; height: 12px; }
.kakao-system-notice { align-self: center; max-width: 91%; margin: 0 0 5px; padding: 7px 13px; border-radius: 13px; background: #91acbc48; color: #324854; text-align: center; overflow-wrap: anywhere; font-size: 12px; font-weight: 500; line-height: 18px; letter-spacing: -.2px; }
.kakao-chat .bubble-wrap { position: relative; display: flex; flex-direction: row; align-items: flex-end; gap: 5px; max-width: 100%; width: auto; }
.kakao-chat .bubble-wrap.kakao-incoming { width: 100%; align-items: flex-start; gap: 8px; }
.kakao-incoming>.kakao-avatar,.kakao-avatar-spacer { flex-shrink: 0; width: 33px; height: 33px; margin-top: 0; }
.kakao-avatar-spacer { height: 1px; }
.kakao-chat .bubble-wrap.kakao-group-continuation { margin-top: -6px; }
.kakao-message-main { flex: 1; min-width: 0; padding-top: 0; }
.kakao-message-main>.bubble-sender { display: block; margin: 0 0 2px; padding: 0; font-size: 12.5px; line-height: 17px; font-weight: 500; color: #303b40; letter-spacing: -.3px; }
.kakao-message-line { display: flex; align-items: flex-end; gap: 5px; }
.kakao-chat .bubble { --kakao-bubble-color: #fff; position: relative; min-width: 0; max-width: 100%; padding: 6.5px 10px; border-radius: 14px; color: #191919; background: var(--kakao-bubble-color); font-size: 15px; line-height: 21px; font-weight: 500; letter-spacing: -.3px; }
.kakao-incoming .bubble { max-width: calc(100% - 37px); }
.kakao-chat .kakao-group-start .bubble::before { content: ""; position: absolute; top: 1px; left: -2px; width: 11px; height: 12px; background: var(--kakao-bubble-color); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 12'%3E%3Cpath d='M11 1C7.7.8 4.2-.2 0 .1 2.1 2.6 3.1 5.8 3 10.7L11 12Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 12'%3E%3Cpath d='M11 1C7.7.8 4.2-.2 0 .1 2.1 2.6 3.1 5.8 3 10.7L11 12Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; }
.kakao-chat .bubble-wrap.mine { flex-direction: row-reverse; align-self: flex-end; max-width: 83%; margin: 0; padding-top: 0; }
.kakao-chat .mine.kakao-group-continuation { margin-top: -6px; }
.kakao-chat .mine .bubble { --kakao-bubble-color: #ffe500; color: #191919; }
.kakao-chat .mine.kakao-group-start .bubble::before { left: auto; right: -2px; transform: scaleX(-1); }
.kakao-message-meta { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; flex-shrink: 0; gap: 1px; padding-bottom: 1px; }
.kakao-chat .mine .kakao-message-meta { align-items: flex-end; }
.kakao-chat .bubble-time { color: #4f5c62; font-size: 10.5px; line-height: 13px; padding: 0; font-weight: 500; letter-spacing: -.2px; white-space: nowrap; }
.kakao-chat .bubble.kakao-sticker { flex-shrink: 0; width: 116px; height: 116px; padding: 0; background: transparent; border-radius: 0; }
.kakao-sticker>svg { display: block; width: 100%; height: 100%; }
.kakao-chat .bubble.kakao-sticker::before,.kakao-chat .bubble.kakao-media-card::before { display: none; }
.kakao-chat .bubble.kakao-media-card { position: relative; width: 174px; height: 130px; padding: 0; overflow: hidden; border-radius: 13px; background: #e6edeb; }
.kakao-chat .bubble.kakao-loop-preview { height: 148px; background: linear-gradient(180deg,#f2f7ee 0%,#e4eddf 75%,#dce8d7 100%); }
.kakao-loop-preview>.kakao-loop-canvas { display: block; width: 100%; height: 100%; }
.kakao-loop-sheep { transform-box: fill-box; transform-origin: center bottom; animation: kakao-sheep-bounce 1.15s ease-in-out infinite; }
.kakao-angry-sheep { animation: kakao-sheep-stomp .8s ease-in-out infinite; }
@keyframes kakao-sheep-stomp {
  0%,100% { transform: translateY(1px) scale(1.08,.92) rotate(-3deg); }
  22% { transform: translateY(-14px) scale(.98,1.02) rotate(3deg); }
  46% { transform: translateY(2px) scale(1.12,.86) rotate(3deg); }
  70% { transform: translateY(-14px) scale(.98,1.02) rotate(-3deg); }
  90% { transform: translateY(2px) scale(1.12,.86) rotate(-3deg); }
}
.kakao-loop-shadow { transform-box: fill-box; transform-origin: center; animation: kakao-sheep-shadow 1.15s ease-in-out infinite; }
.kakao-sticker-nod { transform-box: fill-box; transform-origin: center 70%; animation: kakao-mouse-nod 1.5s ease-in-out infinite; }
@keyframes kakao-mouse-nod {
  0%,65%,100% { transform: rotate(0deg) translateY(0); }
  20%,48% { transform: rotate(7deg) translateY(3px); }
  34% { transform: rotate(-3deg) translateY(-1px); }
}
@keyframes kakao-sheep-bounce {
  0%,100% { transform: translateY(0) rotate(0deg) scale(1); }
  15% { transform: translateY(2px) rotate(1deg) scale(1.08,.9); }
  40% { transform: translateY(-22px) rotate(-4deg) scale(.98,1.03); }
  67% { transform: translateY(1px) rotate(2deg) scale(1.1,.88); }
  82% { transform: translateY(-3px) rotate(-1deg) scale(.99,1.01); }
}
@keyframes kakao-sheep-shadow {
  0%,100% { transform: scale(1); opacity: .14; }
  15%,67% { transform: scale(1.1,.85); opacity: .17; }
  40% { transform: scale(.65,.8); opacity: .06; }
  82% { transform: scale(.96); opacity: .12; }
}
@media (prefers-reduced-motion:reduce) {
  .kakao-loop-sheep,.kakao-loop-shadow,.kakao-sticker-nod,.kakao-angry-sheep { animation: none; }
  .kakao-loop-shadow { opacity: .14; }
}
.kakao-image-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: #68777e!important; background: #d9e2e7!important; font-size: 13px!important; }
.kakao-image-placeholder>.icon { width: 32px; height: 32px; }
.kakao-chat .bubble.kakao-map-link { width: 224px; max-width: 100%; padding: 0; overflow: hidden; }
.kakao-chat .bubble.kakao-map-link::before { display: none; }
.kakao-map-url { display: block; padding: 9px 10px; color: #155ab5; font-size: 13px; line-height: 18px; text-decoration: underline; overflow-wrap: anywhere; }
.kakao-map-preview { display: flex; align-items: center; gap: 10px; padding: 12px; border-top: .5px solid #e6e6e6; background: #fff; }
.kakao-map-logo { display: grid; place-items: center; width: 34px; height: 34px; flex-shrink: 0; }
.kakao-map-logo>svg { display: block; width: 27px; height: 34px; }
.kakao-map-preview>div { display: flex; flex-direction: column; gap: 3px; }
.kakao-map-preview strong { color: #191919; font-size: 14px; line-height: 19px; font-weight: 650; }
.kakao-map-preview>div>span { color: #777; font-size: 12px; line-height: 17px; }
.kakao-chat .bubble.kakao-ad-capture { width: 206px; height: 206px; background: #e9e5e5; }
.kakao-ad-capture>img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.kakao-chat .bubble.kakao-ad-capture.is-face-crop { width: 148px; height: 148px; }
.kakao-ad-capture.is-face-crop>img { width: 250%; max-width: none; height: 250%; object-fit: cover; transform: translate(-29.5%,-16%); }
.kakao-chat .chat-composer { position: absolute; z-index: 9; left: 10px; right: 10px; bottom: 33px; display: flex; align-items: center; gap: 7px; min-height: 48px; padding: 6px 7px; border: .9px solid #f5fbff; border-radius: 29px; background: #e8f5ffd6; box-shadow: inset 0 1px 1px #fff,0 5px 26px #3c637013; backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
.kakao-chat .chat-composer textarea { flex: 1; min-width: 0; min-height: 32px; max-height: 100px; margin: 0; padding: 5px 1px; border: 0; border-radius: 0; color: #172e3c; background: transparent; font-size: 16px; line-height: 22px; letter-spacing: -.35px; }
.kakao-chat .chat-composer textarea::placeholder { color: #8e9ca7; }
.kakao-compose-plus,.kakao-compose-hash { display: grid; place-items: center; flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%; background: #fff; color: #1c2c34; }
.kakao-compose-plus .icon,.kakao-compose-hash .icon { width: 23px; height: 23px; }
.kakao-compose-smile { display: grid; place-items: center; flex-shrink: 0; width: 30px; height: 30px; color: #191919; }
.kakao-compose-smile .icon { width: 28px; height: 28px; }
.kakao-chat .send-button { display: grid; place-items: center; flex-shrink: 0; width: 32px; height: 32px; margin: 0; border-radius: 50%; color: #1b2d35; background: #fee500; }
.kakao-chat .send-button .icon { width: 22px; height: 22px; }
.kakao-chat .send-button[hidden],.kakao-compose-hash[hidden] { display: none; }
@media (max-width:350px) {
  .kakao-list-header { padding-left: 14px; padding-right: 14px; }
  .kakao-list-header>div { gap: 14px; }
  .kakao-list-app .kakao-chat-row,.kakao-list-ad { padding-left: 14px; padding-right: 14px; gap: 10px; }
  .kakao-list-app .kakao-chat-row>.kakao-avatar,.kakao-group-avatar,.kakao-ad-image { width: 43px; height: 43px; }
  .kakao-row-copy>strong { font-size: 15px; }
  .kakao-row-copy>p { font-size: 13px; line-height: 18px; }
  .kakao-row-meta { min-width: 35px; }
  .kakao-row-meta>time { font-size: 11px; }
  .kakao-ad-copy>strong { font-size: 13px; line-height: 18px; }
  .kakao-list-ad>button { min-width: 59px; padding: 0 9px; font-size: 12px; }
  .kakao-chat .kakao-thread-header { grid-template-columns: 72px minmax(0,1fr) 72px; gap: 8px; padding-left: 10px; padding-right: 10px; }
  .kakao-back { padding: 0 6px; font-size: 16px; }
  .kakao-thread-tools { width: 72px; gap: 6px; padding: 0 7px; }
  .kakao-thread-tools button { width: 24px; }
  .kakao-thread-title { font-size: 16px; }
}