npm - zignal-stencil-library - Versions diffs - 1.1.121 → 1.1.123 - Mend

zignal-stencil-library 1.1.121 → 1.1.123

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (391) hide show

package/dist/collection/components/message-box/message-box.css CHANGED Viewed

	@@ -1 +1 @@
1	- @layer base{,::backdrop,:after,:before{--tw-space-x-reverse:0;--tw-shadow:0 0 #0000;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-alpha:100%;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-offset-width:0;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-drop-shadow-alpha:100%;--tw-border-style:solid;--tw-space-y-reverse:0;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;border:0 solid;box-sizing:border-box;margin:0;padding:0}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){,::backdrop,:after,:before{--tw-leading:initial;--tw-space-x-reverse:0;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-font-weight:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-border-style:solid;--tw-space-y-reverse:0;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer theme{:host,:root{--container-xl:36rem;--color-yellow-500:oklch(79.5% .184 86.047);--color-yellow-300:oklch(90.5% .182 98.111);--container-3xs:16rem;--container-sm:24rem;--color-slate-500:oklch(55.4% .046 257.417);--leading-relaxed:1.625;--color-red-50:oklch(97.1% .013 17.38);--color-red-200:oklch(88.5% .062 18.334);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-900:oklch(20.8% .042 265.755);--container-xs:20rem;--container-md:28rem;--text-2xl:1.5rem;--text-2xl--line-height:1.33333;--leading-tight:1.25;--leading-snug:1.375;--color-red-700:oklch(50.5% .213 27.518);--color-green-500:oklch(72.3% .219 149.579);--color-green-700:oklch(52.7% .154 150.069);--color-blue-500:oklch(62.3% .214 259.815);--color-pink-100:oklch(94.8% .028 342.258);--font-weight-semibold:600;--font-weight-bold:700;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-500:oklch(63.7% .237 25.331);--color-blue-600:oklch(54.6% .245 262.881);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:1.33333;--text-sm:.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-base--line-height:1.5;--text-lg:1.125rem;--text-lg--line-height:1.55556;--font-weight-medium:500;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:"Kanit",var(--default-font);--default-mono-font-family:var(--font-mono);--default-font:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--color-primary:#e02848;--color-secondary:#023761;--color-background:#fff;--color-primary-dark:#b50f30;--color-secondary-dark:#fff;--color-background-dark:#23292d}}@layer base{::file-selector-button{appearance:button;background-color:#0000;border:0 solid;border-radius:0;box-sizing:border-box;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;margin:0;margin-inline-end:4px;opacity:1;padding:0}:host,html{-webkit-text-size-adjust:100%;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;tab-size:4;-webkit-tap-highlight-color:transparent}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}button,input,optgroup,select,textarea{background-color:#0000;border-radius:0;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;min-height:1.5em;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-month-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-second-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-datetime-edit-meridiem-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}[multiple],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],input:where(:not([type])),select,textarea{appearance:none;--tw-shadow:0 0 #0000;background-color:#fff;border-color:oklch(55.1% .027 264.364);border-radius:0;border-width:1px;font-size:1rem;line-height:1.5rem;padding:.5rem .75rem}:is([type=text],input:where(:not([type])),[type=email],[type=url],[type=password],[type=number],[type=date],[type=datetime-local],[type=month],[type=search],[type=tel],[type=time],[type=week],[multiple],textarea,select):focus{outline-offset:2px;--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:oklch(54.6% .245 262.881);--tw-ring-offset-shadow:var(--tw-ring-inset)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color);border-color:oklch(54.6% .245 262.881);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000}input::placeholder,textarea::placeholder{color:oklch(55.1% .027 264.364);opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='oklch(55.1%25 0.027 264.364)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;print-color-adjust:exact}[multiple],[size]:where(select:not([size="1"])){background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;print-color-adjust:unset}[type=checkbox],[type=radio]{appearance:none;color:oklch(54.6% .245 262.881);print-color-adjust:exact;-webkit-user-select:none;user-select:none;vertical-align:middle;--tw-shadow:0 0 #0000;background-color:#fff;background-origin:border-box;border-color:oklch(55.1% .027 264.364);border-width:1px;display:inline-block;flex-shrink:0;height:1rem;padding:0;width:1rem}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{outline-offset:2px;--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:oklch(54.6% .245 262.881);--tw-ring-offset-shadow:var(--tw-ring-inset)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000}[type=checkbox]:checked,[type=radio]:checked{background-color:currentColor;background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:#0000}[type=checkbox]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0'/%3E%3C/svg%3E")}[type=radio]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")}[type=checkbox]:checked:focus,[type=checkbox]:checked:hover,[type=radio]:checked:focus,[type=radio]:checked:hover{background-color:currentColor;border-color:#0000}[type=checkbox]:indeterminate{background-color:currentColor;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:#0000}[type=checkbox]:indeterminate:focus,[type=checkbox]:indeterminate:hover{background-color:currentColor;border-color:#0000}[type=file]{background:unset;border-color:inherit;border-radius:0;border-width:0;font-size:unset;line-height:inherit;padding:0}[type=file]:focus{outline:1px solid buttontext;outline:1px auto -webkit-focus-ring-color}}@layer components{.dialog-backdrop{align-items:center;background-color:#0006;display:flex;inset:calc(var(--spacing)0);justify-content:center;position:fixed;z-index:50}@supports (color:color-mix(in lab,red,red)){.dialog-backdrop{background-color:color-mix(in oklab,var(--color-black)40%,transparent)}}.chat-item{align-items:flex-start;border-radius:var(--radius-xl);cursor:pointer;display:flex;margin-block:calc(var(--spacing)1);margin-inline:calc(var(--spacing)2);padding-block:calc(var(--spacing)3);padding-inline:calc(var(--spacing)4);position:relative;--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}:where(.chat-item>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)4(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)4var(--tw-space-x-reverse))}.chat-item .chat-item-pin{position:absolute;right:calc(var(--spacing)-3);top:calc(var(--spacing)1)}.chat-item .chat-item-pin-icon{fill:currentColor;height:calc(var(--spacing)3);rotate:45deg;width:calc(var(--spacing)3)}.chat-item .chat-item-content-container{display:flex;flex-direction:row;width:100%}:where(.chat-item .chat-item-content-container>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)4(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)4var(--tw-space-x-reverse))}.chat-item .chat-item-avatar-wrapper{align-self:center;flex-shrink:0;position:relative}.chat-item .chat-item-avatar-badge{bottom:calc(var(--spacing)-.5);position:absolute;right:calc(var(--spacing)-.5)}.chat-item .chat-item-content-wrapper{min-height:calc(var(--spacing)18);width:100%}.chat-item .chat-item-content-main{align-items:center;display:flex}:where(.chat-item .chat-item-content-main>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)1(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)1var(--tw-space-x-reverse))}.chat-item .chat-item-content-main-image{border-radius:3.40282e+38px;height:calc(var(--spacing)4);width:calc(var(--spacing)4)}.chat-item .chat-item-content-main-name{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.chat-item .chat-item-content-main-name,.chat-item .chat-item-content-main-time{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.chat-item .chat-item-content-main-time{color:var(--color-gray-500);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));margin-left:auto}.chat-item .chat-item-content-secondary{align-items:flex-start;display:flex;flex-direction:row;width:100%}.chat-item .chat-item-content-secondary-nickname{font-size:var(--text-base);-webkit-line-clamp:1;line-height:var(--tw-leading,var(--text-base--line-height));-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.chat-item .chat-item-content-secondary-message{color:var(--color-gray-600);font-size:var(--text-sm);-webkit-line-clamp:1;line-height:var(--tw-leading,var(--text-sm--line-height));-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.chat-item .chat-item-content-unread{background-color:var(--color-primary);border-radius:3.40282e+38px;color:var(--color-white);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));margin-left:auto}.chat-item .chat-item-content-unread-mark{display:inline-block;height:calc(var(--spacing)2.5);width:calc(var(--spacing)2.5)}.chat-item .chat-item-content-unread-count{padding-block:calc(var(--spacing).5);padding-inline:calc(var(--spacing)2)}.z-icon-button{cursor:pointer;font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));--tw-font-weight:var(--font-weight-medium);align-items:center;border-radius:3.40282e+38px;display:inline-flex;font-weight:var(--font-weight-medium);justify-content:center;transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.z-icon-button:focus{--tw-outline-style:none;outline-style:none}.z-icon-button-primary{background-color:var(--color-primary);color:var(--color-white)}.z-icon-button-outlined{border-color:var(--color-primary);border-style:var(--tw-border-style);border-width:1px}.z-icon-button-outlined,.z-icon-button-text{color:var(--color-primary)}.z-icon-button-disabled{cursor:not-allowed;opacity:.5}.z-button{cursor:pointer;--tw-font-weight:var(--font-weight-medium);align-items:center;border-radius:3.40282e+38px;display:inline-flex;font-weight:var(--font-weight-medium);justify-content:center;transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.z-button:focus{--tw-outline-style:none;outline-style:none}.z-button-small{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));padding-block:calc(var(--spacing)1.5);padding-inline:calc(var(--spacing)2)}.z-button-medium{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)3)}.z-button-large{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height));padding-block:calc(var(--spacing)3);padding-inline:calc(var(--spacing)4)}.z-button-primary{background-color:var(--color-primary);color:var(--color-white)}.z-button-outlined{border-color:var(--color-primary);border-style:var(--tw-border-style);border-width:1px;color:var(--color-primary)}.z-button-disabled{cursor:not-allowed;opacity:.5}.z-button-text{margin-inline:calc(var(--spacing)2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.z-input-area-label{margin-bottom:calc(var(--spacing)1);--tw-font-weight:var(--font-weight-medium);display:block;font-weight:var(--font-weight-medium)}.z-input-area-input,.z-input-area-label{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.z-input-area-input{border-radius:var(--radius-lg);border-style:var(--tw-border-style);padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);width:100%;--tw-ring-color:var(--color-primary);border-width:1px}.z-input-area-input:focus{border-color:var(--color-primary);--tw-outline-style:none;outline-style:none}.z-input-area-error{color:var(--color-red-500);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));margin-top:calc(var(--spacing)1)}.z-input-label{margin-bottom:calc(var(--spacing)1);--tw-font-weight:var(--font-weight-medium);display:block;font-weight:var(--font-weight-medium)}.z-input,.z-input-label{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.z-input{border-style:var(--tw-border-style);padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);width:100%;--tw-ring-color:var(--color-primary);border-radius:3.40282e+38px;border-width:1px}.z-input:focus{border-color:var(--color-primary);--tw-outline-style:none;outline-style:none}.z-input-error{color:var(--color-red-500);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));margin-top:calc(var(--spacing)1)}.z-select-input-label{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));margin-bottom:calc(var(--spacing)1);--tw-font-weight:var(--font-weight-medium);display:block;font-weight:var(--font-weight-medium)}.z-tag-or-status-item{align-items:center;border-radius:var(--radius-2xl);gap:calc(var(--spacing)2);padding-block:calc(var(--spacing)1.5);padding-inline:calc(var(--spacing)3);--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);display:inline-flex}.z-tag-or-status-item .z-tag-or-status-item-name{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));max-width:calc(var(--spacing)20)}.z-tag-or-status-item .z-tag-or-status-item-icon{border-radius:3.40282e+38px;height:calc(var(--spacing)4);width:calc(var(--spacing)4)}.z-context-input{align-items:stretch;display:flex;flex-direction:row;margin-block:calc(var(--spacing)1)}.z-context-input-key{border-bottom-left-radius:var(--radius-3xl);border-style:var(--tw-border-style);border-top-left-radius:var(--radius-3xl);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));max-height:6.4rem;min-height:2.4rem;padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);resize:none;width:100%;--tw-ring-color:var(--color-primary);border-width:1px;flex:1}.z-context-input-key:focus{border-color:var(--color-primary);--tw-outline-style:none;outline-style:none}.z-context-input-value{border-bottom-right-radius:var(--radius-3xl);border-style:var(--tw-border-style);border-top-right-radius:var(--radius-3xl);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));max-height:6.4rem;min-height:2.4rem;padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);resize:none;width:100%;--tw-ring-color:var(--color-primary);border-width:1px;flex:1}.z-context-input-value:focus{border-color:var(--color-primary);--tw-outline-style:none;outline-style:none}.z-text-with-link{color:var(--color-blue-600);text-decoration-line:underline}.z-button-group{display:inline-flex}.z-button-group-tab{border-radius:var(--radius-md);display:flex;gap:calc(var(--spacing)1);padding:calc(var(--spacing).5)!important}.z-button-group-item{border-style:var(--tw-border-style);cursor:pointer;--tw-font-weight:var(--font-weight-medium);align-items:center;border-width:1px;display:inline-flex;font-weight:var(--font-weight-medium);justify-content:center;transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.z-button-group-item:focus{--tw-outline-style:none;outline-style:none}.z-button-group-item-tab{align-items:center;border-radius:var(--radius-sm);display:flex;flex:1;flex-direction:column;gap:calc(var(--spacing)2);justify-content:center;padding:calc(var(--spacing)1)!important}.z-button-group-item-tab,.z-button-group-item-tab-selected{border-style:var(--tw-border-style)!important;border-width:0!important}.z-button-group-item-tab-selected{background-color:var(--color-white);--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.z-button-group-item-tab-unselected{border-style:var(--tw-border-style)!important;border-width:0!important}.z-button-group-small{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));padding-block:calc(var(--spacing)1.5);padding-inline:calc(var(--spacing)2)}.z-button-group-medium{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)3)}.z-button-group-large{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height));padding-block:calc(var(--spacing)3);padding-inline:calc(var(--spacing)4)}.z-button-group-item-first{border-bottom-left-radius:3.40282e+38px;border-top-left-radius:3.40282e+38px}.z-button-group-item-last{border-bottom-right-radius:3.40282e+38px;border-top-right-radius:3.40282e+38px}.z-button-group-item-middle{border-radius:0}.z-button-group-item-primary-selected{background-color:var(--color-primary);border-color:var(--color-primary);color:var(--color-white)}.z-button-group-item-primary-unselected{background-color:var(--color-white);border-color:var(--color-primary);color:var(--color-primary)}.z-button-group-item-outlined-selected{background-color:var(--color-primary);border-color:var(--color-primary);color:var(--color-white)}.z-button-group-item-outlined-unselected{background-color:#0000;border-color:var(--color-primary);color:var(--color-primary)}.z-button-group-item-disabled{cursor:not-allowed;opacity:.5}.z-button-group-item:not(:first-child){margin-left:-1px}}@layer utilities{.hidden{display:none}.hidden\!{display:none!important}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}.scroll-container::-webkit-scrollbar{background:#0000001a;height:8px;width:8px}.scroll-container:active::-webkit-scrollbar,.scroll-container:hover::-webkit-scrollbar{background:#0003}.scroll-container:active::-webkit-scrollbar-thumb,.scroll-container:hover::-webkit-scrollbar-thumb{background:#0006;border-radius:4px}[data-theme=light] .text-primary{color:var(--color-black)}[data-theme=dark] .text-primary{color:var(--color-white)}[data-theme=light] .text-gray{color:var(--color-gray-500)}[data-theme=dark] .text-gray{color:var(--color-gray-300)}[data-theme=light] .text-accent{color:var(--color-primary)}[data-theme=dark] .text-accent{color:var(--color-primary-dark)}[data-theme=light] .bg-surface{background-color:var(--color-background,#fff)}[data-theme=dark] .bg-surface{background-color:var(--color-background-dark,#23292d)}[data-theme=light] .bg-paper{background-color:var(--color-gray-100)}[data-theme=dark] .bg-paper{background-color:var(--color-gray-700)}[data-theme=light] .bg-time-badge{background-color:#0000004d}[data-theme=dark] .bg-time-badge{background-color:#ffffff4d}[data-theme=light] .bg-primary{background-color:var(--color-black)}[data-theme=dark] .bg-primary{background-color:var(--color-white)}[data-theme=light] .bg-accent{background-color:var(--color-primary)}[data-theme=dark] .bg-accent{background-color:var(--color-primary-dark)}[data-theme=light] .border-primary{border-color:var(--color-black)}[data-theme=dark] .border-primary{border-color:var(--color-white)}[data-theme=light] .border-divider{border-color:var(--color-gray-200)}[data-theme=dark] .border-divider{border-color:var(--color-gray-600)}[data-theme=light] .border-accent{border-color:var(--color-primary)}[data-theme=dark] .border-accent{border-color:var(--color-primary-dark)}.z-text-light{color:var(--color-black)}.z-text-dark{color:var(--color-white)}.z-text-primary-light{color:var(--color-primary)}.z-text-primary-dark{color:var(--color-primary-dark)}.z-text-gray-light{color:var(--color-gray-500)}.z-text-gray-dark{color:var(--color-gray-300)}.z-text-background-light{color:var(--color-background)}.z-text-background-dark{color:var(--color-background-dark)}.z-border-light{border-color:var(--color-black)}.z-border-dark{border-color:var(--color-white)}.z-border-primary-light{border-color:var(--color-primary)}.z-border-primary-dark{border-color:var(--color-primary-dark)}.z-border-divider-light{border-color:var(--color-gray-400)}.z-border-divider-dark{border-color:var(--color-gray-300)}.z-search-input-background-light{background-color:var(--color-gray-200)}.z-search-input-background-dark{background-color:var(--color-gray-500)}.z-chat-input-background-light{background-color:var(--color-white)}.z-chat-input-background-dark{background-color:var(--color-gray-700)}.z-placeholder-light::placeholder{color:var(--color-gray-500)}.z-placeholder-dark::placeholder{color:var(--color-gray-200)}.z-background-primary-light{background-color:var(--color-primary)}.z-background-primary-dark{background-color:var(--color-primary-dark)}.z-background-light{background-color:var(--color-background)}.z-background-dark{background-color:var(--color-background-dark)}.z-paper-light{background-color:var(--color-gray-100)}.z-paper-dark{background-color:var(--color-gray-700)}.z-bg-gray-light{background-color:var(--color-gray-500)}.z-bg-gray-dark{background-color:var(--color-gray-300)}.z-width-100{width:100%}.z-width-90{width:90%}.z-width-75{width:75%}.z-width-50{width:50%}.z-width-25{width:25%}.z-width-0{width:0}.z-animate-width{transition-duration:.5s;transition-property:width;transition-timing-function:cubic-bezier(.4,0,.2,1)}.z-animate-grid-template-cols{transition:grid-template-rows .5s}[type=checkbox]{background-color:var(--color-gray-300);border-color:var(--color-gray-300);border-radius:4px;cursor:pointer}[type=checkbox]:checked,[type=checkbox]:indeterminate{background-color:var(--color-primary);border-color:var(--color-primary);border-radius:4px;cursor:pointer}[type=checkbox]:focus{offset:0;outline-offset:0;--tw-ring-color:var(--color-primary);outline:none}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.grid-cols-1{grid-template-columns:1fr}.grid-cols-1_3{grid-template-columns:1fr 3fr}.grid-cols-1_2_1{grid-template-columns:1fr 2fr 1fr}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{.container{width:100%}.cursor-pointer{cursor:pointer}.border-primary{border-color:var(--color-primary)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-primary{color:var(--color-primary)}.relative{position:relative}.size-5{height:calc(var(--spacing)5);width:calc(var(--spacing)5)}.rotate-45{rotate:45deg}.text-blue-500{color:var(--color-blue-500)}.text-green-500{color:var(--color-green-500)}.mb-2{margin-bottom:calc(var(--spacing)2)}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)2(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)2var(--tw-space-y-reverse))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.mt-auto{margin-top:auto}.mb-auto{margin-bottom:auto}.text-black{color:var(--color-black)}.w-xl{width:var(--container-xl)}.w-xs{width:var(--container-xs)}.m-auto{margin:auto}.size-32{height:calc(var(--spacing)32);width:calc(var(--spacing)32)}.\!hidden{display:none!important}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.col-span-2{grid-column:span 2/span 2}.my-2{margin-block:calc(var(--spacing)2)}.w-full{width:100%}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.py-2{padding-block:calc(var(--spacing)2)}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.visible{visibility:visible}.-top-12{top:calc(var(--spacing)-12)}.-top-24{top:calc(var(--spacing)-24)}.mx-auto{margin-inline:auto}.mt-10{margin-top:calc(var(--spacing)10)}.mb-10{margin-bottom:calc(var(--spacing)10)}.inline-block{display:inline-block}.size-18{height:calc(var(--spacing)18);width:calc(var(--spacing)18)}.p-4{padding:calc(var(--spacing)4)}.px-4{padding-inline:calc(var(--spacing)4)}.pt-4{padding-top:calc(var(--spacing)4)}.pb-8{padding-bottom:calc(var(--spacing)8)}.bg-pink-100{background-color:var(--color-pink-100)}.absolute{position:absolute}.right-full{right:100%}.-bottom-2{bottom:calc(var(--spacing)-2)}.left-full{left:100%}.mr-2{margin-right:calc(var(--spacing)2)}.mb-0\.5{margin-bottom:calc(var(--spacing).5)}.mb-2\.5{margin-bottom:calc(var(--spacing)2.5)}.ml-2{margin-left:calc(var(--spacing)2)}.flex{display:flex}.size-3{height:calc(var(--spacing)3);width:calc(var(--spacing)3)}.size-6{height:calc(var(--spacing)6);width:calc(var(--spacing)6)}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.items-center{align-items:center}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.rounded-full{border-radius:3.40282e+38px}.bg-yellow-300{background-color:var(--color-yellow-300)}.pl-10{padding-left:calc(var(--spacing)10)}.text-left{text-align:left}.text-right{text-align:right}.mt-1{margin-top:calc(var(--spacing)1)}.line-clamp-3{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.size-4{height:calc(var(--spacing)4);width:calc(var(--spacing)4)}.size-8{height:calc(var(--spacing)8);width:calc(var(--spacing)8)}.max-w-3xs{max-width:var(--container-3xs)}.max-w-sm{max-width:var(--container-sm)}.resize{resize:both}.rounded-br-\[0\]{border-bottom-right-radius:0}.rounded-bl-\[0\]{border-bottom-left-radius:0}.bg-black{background-color:var(--color-black)}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing)2)}.p-3{padding:calc(var(--spacing)3)}.px-3{padding-inline:calc(var(--spacing)3)}.text-white{color:var(--color-white)}.underline{text-decoration-line:underline}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.-right-0\.5{right:calc(var(--spacing)-.5)}.-bottom-0\.5{bottom:calc(var(--spacing)-.5)}.col-span-3{grid-column:span 3/span 3}.mt-2{margin-top:calc(var(--spacing)2)}.flex-wrap{flex-wrap:wrap}.gap-y-1{row-gap:calc(var(--spacing)1)}.border-b-\[0\.5px\]{border-bottom-style:var(--tw-border-style);border-bottom-width:.5px}.pt-2{padding-top:calc(var(--spacing)2)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.whitespace-nowrap{white-space:nowrap}.size-42{height:calc(var(--spacing)42);width:calc(var(--spacing)42)}.h-20{height:calc(var(--spacing)20)}.w-42{width:calc(var(--spacing)42)}.top-1\/2{top:50%}.right-2{right:calc(var(--spacing)2)}.ml-auto{margin-left:auto}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.inline-flex{display:inline-flex}.h-9{height:calc(var(--spacing)9)}.h-10{height:calc(var(--spacing)10)}.min-h-0{min-height:calc(var(--spacing)0)}.w-9{width:calc(var(--spacing)9)}.w-10{width:calc(var(--spacing)10)}.min-w-0{min-width:calc(var(--spacing)0)}.flex-1{flex:1}.-translate-y-1\/2{--tw-translate-y:-50%;translate:var(--tw-translate-x)var(--tw-translate-y)}.animate-spin{animation:var(--animate-spin)}.justify-between{justify-content:space-between}.gap-1{gap:calc(var(--spacing)1)}.gap-2{gap:calc(var(--spacing)2)}.gap-2\.5{gap:calc(var(--spacing)2.5)}.gap-3{gap:calc(var(--spacing)3)}.gap-4{gap:calc(var(--spacing)4)}.overflow-y-auto{overflow-y:auto}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.py-2\.5{padding-block:calc(var(--spacing)2.5)}.py-3{padding-block:calc(var(--spacing)3)}.pr-9{padding-right:calc(var(--spacing)9)}.text-center{text-align:center}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.break-words{overflow-wrap:break-word}.text-gray-400{color:var(--color-gray-400)}.ring-primary{--tw-ring-color:var(--color-primary)}.focus\:border-primary:focus{border-color:var(--color-primary)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-40:disabled{opacity:.4}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities;/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}@keyframes spin{to{transform:rotate(1turn)}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{.border-transparent{border-color:#0000}.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.fixed{position:fixed}.inset-0{inset:calc(var(--spacing)0)}.top-3{top:calc(var(--spacing)3)}.right-3{right:calc(var(--spacing)3)}.right-4{right:calc(var(--spacing)4)}.bottom-3{bottom:calc(var(--spacing)3)}.left-3{left:calc(var(--spacing)3)}.z-10{z-index:10}.z-\[80\]{z-index:80}.mt-4{margin-top:calc(var(--spacing)4)}.mt-6{margin-top:calc(var(--spacing)6)}.mb-4{margin-bottom:calc(var(--spacing)4)}.contents{display:contents}.grid{display:grid}.aspect-square{aspect-ratio:1}.size-12{height:calc(var(--spacing)12);width:calc(var(--spacing)12)}.size-14{height:calc(var(--spacing)14);width:calc(var(--spacing)14)}.h-7{height:calc(var(--spacing)7)}.h-8{height:calc(var(--spacing)8)}.h-\[180px\]{height:180px}.h-\[220px\]{height:220px}.h-\[280px\]{height:280px}.h-full{height:100%}.w-7{width:calc(var(--spacing)7)}.w-8{width:calc(var(--spacing)8)}.w-\[200px\]{width:200px}.w-\[250px\]{width:250px}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.max-w-xs{max-width:var(--container-xs)}.flex-shrink-0,.shrink-0{flex-shrink:0}.cursor-not-allowed{cursor:not-allowed}.resize-none{resize:none}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-\[18px\]{border-radius:18px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-\[1\.5px\]{border-style:var(--tw-border-style);border-width:1.5px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-b-\[1\.5px\]{border-bottom-style:var(--tw-border-style);border-bottom-width:1.5px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-none{--tw-border-style:none;border-style:none}.border-current{border-color:currentColor}.border-red-500{border-color:var(--color-red-500)}.bg-slate-900\/40{background-color:#0f172b66}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/40{background-color:color-mix(in oklab,var(--color-slate-900)40%,transparent)}}.bg-slate-900\/60{background-color:#0f172b99}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/60{background-color:color-mix(in oklab,var(--color-slate-900)60%,transparent)}}.bg-transparent{background-color:#0000}.bg-white\/90{background-color:#ffffffe6}@supports (color:color-mix(in lab,red,red)){.bg-white\/90{background-color:color-mix(in oklab,var(--color-white)90%,transparent)}}.object-cover{object-fit:cover}.p-1{padding:calc(var(--spacing)1)}.p-5{padding:calc(var(--spacing)5)}.p-6{padding:calc(var(--spacing)6)}.px-2{padding-inline:calc(var(--spacing)2)}.px-6{padding-inline:calc(var(--spacing)6)}.px-8{padding-inline:calc(var(--spacing)8)}.py-1\.5{padding-block:calc(var(--spacing)1.5)}.py-4{padding-block:calc(var(--spacing)4)}.py-12{padding-block:calc(var(--spacing)12)}.pr-16{padding-right:calc(var(--spacing)16)}.pb-2{padding-bottom:calc(var(--spacing)2)}.pl-2{padding-left:calc(var(--spacing)2)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-\[13px\]{font-size:13px}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.text-red-500{color:var(--color-red-500)}.text-slate-700{color:var(--color-slate-700)}.opacity-0{opacity:0}.opacity-60{opacity:.6}.opacity-80{opacity:.8}.shadow,.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a)}.shadow,.shadow-sm,.shadow-xl{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a)}.transition-all{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-colors{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-opacity{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.focus\:border-red-500:focus{border-color:var(--color-red-500)}.focus\:ring-0:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor)}.focus\:ring-0:focus,.focus\:ring-2:focus{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor)}.focus\:ring-red-200:focus{--tw-ring-color:var(--color-red-200)}.focus\:ring-red-500:focus{--tw-ring-color:var(--color-red-500)}.focus\:ring-slate-200:focus{--tw-ring-color:var(--color-slate-200)}.inset-y-0{inset-block:calc(var(--spacing)0)}.size-10{height:calc(var(--spacing)10);width:calc(var(--spacing)10)}.h-\[160px\]{height:160px}.h-\[200px\]{height:200px}.w-\[240px\]{width:240px}.shrink-0{flex-shrink:0}.gap-1\.5{gap:calc(var(--spacing)1.5)}.self-end{align-self:flex-end}.py-1{padding-block:calc(var(--spacing)1)}.py-10{padding-block:calc(var(--spacing)10)}.pb-1{padding-bottom:calc(var(--spacing)1)}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.whitespace-pre-line{white-space:pre-line}.text-slate-500{color:var(--color-slate-500)}.opacity-70{opacity:.7}.shadow-\[0_8px_24px_rgba$15\,23\,42\,0\.08$\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#0f172a14)}.shadow-\[0_8px_24px_rgba$15\,23\,42\,0\.08$\],.shadow-sm{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a)}.col-span-full{grid-column:1/-1}.h-16{height:calc(var(--spacing)16)}.w-16{width:calc(var(--spacing)16)}.auto-rows-auto{grid-auto-rows:auto}.content-start{align-content:flex-start}.p-1\.5{padding:calc(var(--spacing)1.5)}.text-yellow-500{color:var(--color-yellow-500)}.size-16{height:calc(var(--spacing)16);width:calc(var(--spacing)16)}.size-\[8px\]{height:8px;width:8px}.size-\[10px\]{height:10px;width:10px}.col-span-1{grid-column:span 1/span 1}.m-2{margin:calc(var(--spacing)2)}.mx-4{margin-inline:calc(var(--spacing)4)}.ml-0\.5{margin-left:calc(var(--spacing).5)}.w-1\/2{width:50%}.max-w-32{max-width:calc(var(--spacing)32)}.translate-y-0{--tw-translate-y:calc(var(--spacing)0)}.translate-y-0,.translate-y-full{translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-y-full{--tw-translate-y:100%}.bg-secondary{background-color:var(--color-secondary)}.text-green-700{color:var(--color-green-700)}.text-red-700{color:var(--color-red-700)}.capitalize{text-transform:capitalize}.opacity-100{opacity:1}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@property --tw-leading{syntax:"";inherits:false}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}:host{display:block}.message-box-wrapper{display:flex;flex-direction:column}.message-box-no-selected-chat-box{display:grid;margin-block:auto;place-content:center;text-align:center}.message-box-syncing-message{display:flex;flex-direction:column;gap:calc(var(--spacing)2);margin-inline:auto;margin-top:calc(var(--spacing)4);pointer-events:none;width:fit-content;z-index:10}.message-box-container{flex:1;overflow-y:auto;scroll-behavior:smooth}:where(.message-box-container>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)2(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)2var(--tw-space-y-reverse))}.message-box-loading{color:var(--color-gray-400);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));text-align:center}.message-box-loading-icon{animation:var(--animate-spin);height:calc(var(--spacing)5);margin-inline:auto;width:calc(var(--spacing)5)}.message-box-time-wrapper{margin-block:calc(var(--spacing)2);text-align:center}.message-box-time{border-radius:var(--radius-xl);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));padding-block:calc(var(--spacing)1);padding-inline:calc(var(--spacing)2)}.message-box-scroll-to-bottom{opacity:.5}.message-box-scroll-to-bottom,.message-box-token-wrapper{--tw-translate-x:-50%;left:50%;position:absolute;translate:var(--tw-translate-x)var(--tw-translate-y)}.message-box-token-wrapper{border-radius:var(--radius-2xl);color:var(--color-white);padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);pointer-events:none;white-space:nowrap;width:fit-content;z-index:10}@property --tw-space-x-reverse{syntax:"";inherits:false;initial-value:0}@property --tw-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"";inherits:false}@property --tw-ring-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"";inherits:false}@property --tw-inset-ring-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-font-weight{syntax:"";inherits:false}@property --tw-blur{syntax:"";inherits:false}@property --tw-brightness{syntax:"";inherits:false}@property --tw-contrast{syntax:"";inherits:false}@property --tw-grayscale{syntax:"";inherits:false}@property --tw-hue-rotate{syntax:"";inherits:false}@property --tw-invert{syntax:"";inherits:false}@property --tw-opacity{syntax:"";inherits:false}@property --tw-saturate{syntax:"";inherits:false}@property --tw-sepia{syntax:"";inherits:false}@property --tw-drop-shadow{syntax:"";inherits:false}@property --tw-drop-shadow-color{syntax:"";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"";inherits:false}@property --tw-border-style{syntax:"";inherits:false;initial-value:solid}@property --tw-space-y-reverse{syntax:"";inherits:false;initial-value:0}@property --tw-translate-x{syntax:"";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"";inherits:false;initial-value:0}@media (forced-colors:active){[type=checkbox]:checked,[type=radio]:checked{appearance:auto}[type=checkbox]:indeterminate{appearance:auto}}@media (hover:hover){.z-button-outlined:hover,.z-button-primary:hover,.z-icon-button-outlined:hover,.z-icon-button-primary:hover,.z-icon-button-text:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.z-button-group-item-tab:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.z-button-group-item-tab-unselected:hover{background-color:var(--color-white)}.z-button-group-item-primary-unselected:hover{--tw-brightness:brightness(95%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.z-button-group-item-outlined-unselected:hover{background-color:#e028481a}@supports (color:color-mix(in lab,red,red)){.z-button-group-item-outlined-unselected:hover{background-color:color-mix(in oklab,var(--color-primary)10%,transparent)}}.hover\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.hover\:text-gray-600:hover{color:var(--color-gray-600)}.group-hover\:opacity-100:is(:where(.group):hover ){opacity:1}.hover\:bg-red-50:hover{background-color:var(--color-red-50)}.hover\:bg-slate-100:hover{background-color:var(--color-slate-100)}.hover\:bg-white:hover{background-color:var(--color-white)}.hover\:opacity-100:hover{opacity:1}}@media screen and (min-width:0){.z-max-height{height:calc(100vh - 56px)}}@media screen and (min-width:600px){.z-max-height{height:calc(100vh - 64px)}}@media (min-width:40rem){.container{max-width:40rem}.sm\:min-w-0{min-width:calc(var(--spacing)0)}.sm\:flex-row{flex-direction:row}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:48rem){.container{max-width:48rem}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (min-width:64rem){.container{max-width:64rem}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}@media not all and (min-width:40rem){.max-sm\:hidden{display:none}}
1	+ @layer base{,::backdrop,:after,:before{--tw-space-x-reverse:0;--tw-shadow:0 0 #0000;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-alpha:100%;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-offset-width:0;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-drop-shadow-alpha:100%;--tw-border-style:solid;--tw-space-y-reverse:0;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;border:0 solid;box-sizing:border-box;margin:0;padding:0}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){,::backdrop,:after,:before{--tw-leading:initial;--tw-space-x-reverse:0;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-font-weight:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-border-style:solid;--tw-space-y-reverse:0;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer theme{:host,:root{--container-xl:36rem;--container-3xs:16rem;--color-yellow-500:oklch(79.5% .184 86.047);--container-sm:24rem;--color-yellow-300:oklch(90.5% .182 98.111);--color-red-50:oklch(97.1% .013 17.38);--color-red-200:oklch(88.5% .062 18.334);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-900:oklch(20.8% .042 265.755);--container-xs:20rem;--container-md:28rem;--text-2xl:1.5rem;--text-2xl--line-height:1.33333;--color-slate-500:oklch(55.4% .046 257.417);--leading-tight:1.25;--leading-snug:1.375;--leading-relaxed:1.625;--color-red-700:oklch(50.5% .213 27.518);--color-green-500:oklch(72.3% .219 149.579);--color-green-700:oklch(52.7% .154 150.069);--color-blue-500:oklch(62.3% .214 259.815);--color-pink-100:oklch(94.8% .028 342.258);--font-weight-semibold:600;--font-weight-bold:700;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-500:oklch(63.7% .237 25.331);--color-blue-600:oklch(54.6% .245 262.881);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:1.33333;--text-sm:.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-base--line-height:1.5;--text-lg:1.125rem;--text-lg--line-height:1.55556;--font-weight-medium:500;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:"Kanit",var(--default-font);--default-mono-font-family:var(--font-mono);--default-font:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--color-primary:#e02848;--color-secondary:#023761;--color-background:#fff;--color-surface:#000;--color-paper:#f3f4f6;--color-divider:#e5e7eb;--color-theme-gray:#6b7280}}@layer base{::file-selector-button{appearance:button;background-color:#0000;border:0 solid;border-radius:0;box-sizing:border-box;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;margin:0;margin-inline-end:4px;opacity:1;padding:0}:host,html{-webkit-text-size-adjust:100%;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;tab-size:4;-webkit-tap-highlight-color:transparent}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}button,input,optgroup,select,textarea{background-color:#0000;border-radius:0;color:inherit;font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;min-height:1.5em;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-month-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-second-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-datetime-edit-meridiem-field{padding-block:0;padding-bottom:0;padding-top:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}[multiple],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],input:where(:not([type])),select,textarea{appearance:none;--tw-shadow:0 0 #0000;background-color:#fff;border-color:oklch(55.1% .027 264.364);border-radius:0;border-width:1px;font-size:1rem;line-height:1.5rem;padding:.5rem .75rem}:is([type=text],input:where(:not([type])),[type=email],[type=url],[type=password],[type=number],[type=date],[type=datetime-local],[type=month],[type=search],[type=tel],[type=time],[type=week],[multiple],textarea,select):focus{outline-offset:2px;--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:oklch(54.6% .245 262.881);--tw-ring-offset-shadow:var(--tw-ring-inset)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color);border-color:oklch(54.6% .245 262.881);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000}input::placeholder,textarea::placeholder{color:oklch(55.1% .027 264.364);opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='oklch(55.1%25 0.027 264.364)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;print-color-adjust:exact}[multiple],[size]:where(select:not([size="1"])){background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;print-color-adjust:unset}[type=checkbox],[type=radio]{appearance:none;color:oklch(54.6% .245 262.881);print-color-adjust:exact;-webkit-user-select:none;user-select:none;vertical-align:middle;--tw-shadow:0 0 #0000;background-color:#fff;background-origin:border-box;border-color:oklch(55.1% .027 264.364);border-width:1px;display:inline-block;flex-shrink:0;height:1rem;padding:0;width:1rem}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{outline-offset:2px;--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:oklch(54.6% .245 262.881);--tw-ring-offset-shadow:var(--tw-ring-inset)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000}[type=checkbox]:checked,[type=radio]:checked{background-color:currentColor;background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:#0000}[type=checkbox]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0'/%3E%3C/svg%3E")}[type=radio]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")}[type=checkbox]:checked:focus,[type=checkbox]:checked:hover,[type=radio]:checked:focus,[type=radio]:checked:hover{background-color:currentColor;border-color:#0000}[type=checkbox]:indeterminate{background-color:currentColor;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:#0000}[type=checkbox]:indeterminate:focus,[type=checkbox]:indeterminate:hover{background-color:currentColor;border-color:#0000}[type=file]{background:unset;border-color:inherit;border-radius:0;border-width:0;font-size:unset;line-height:inherit;padding:0}[type=file]:focus{outline:1px solid buttontext;outline:1px auto -webkit-focus-ring-color}}@layer components{.dialog-backdrop{align-items:center;background-color:#0006;display:flex;inset:calc(var(--spacing)0);justify-content:center;position:fixed;z-index:50}@supports (color:color-mix(in lab,red,red)){.dialog-backdrop{background-color:color-mix(in oklab,var(--color-black)40%,transparent)}}.chat-item{align-items:flex-start;border-radius:var(--radius-xl);cursor:pointer;display:flex;margin-block:calc(var(--spacing)1);margin-inline:calc(var(--spacing)2);padding-block:calc(var(--spacing)3);padding-inline:calc(var(--spacing)4);position:relative;--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}:where(.chat-item>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)4(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)4var(--tw-space-x-reverse))}.chat-item .chat-item-pin{position:absolute;right:calc(var(--spacing)-3);top:calc(var(--spacing)1)}.chat-item .chat-item-pin-icon{fill:currentColor;height:calc(var(--spacing)3);rotate:45deg;width:calc(var(--spacing)3)}.chat-item .chat-item-content-container{display:flex;flex-direction:row;width:100%}:where(.chat-item .chat-item-content-container>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)4(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)4var(--tw-space-x-reverse))}.chat-item .chat-item-avatar-wrapper{align-self:center;flex-shrink:0;position:relative}.chat-item .chat-item-avatar-badge{bottom:calc(var(--spacing)-.5);position:absolute;right:calc(var(--spacing)-.5)}.chat-item .chat-item-content-wrapper{min-height:calc(var(--spacing)18);width:100%}.chat-item .chat-item-content-main{align-items:center;display:flex}:where(.chat-item .chat-item-content-main>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)1(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)1var(--tw-space-x-reverse))}.chat-item .chat-item-content-main-image{border-radius:3.40282e+38px;height:calc(var(--spacing)4);width:calc(var(--spacing)4)}.chat-item .chat-item-content-main-name{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.chat-item .chat-item-content-main-name,.chat-item .chat-item-content-main-time{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.chat-item .chat-item-content-main-time{color:var(--color-gray-500);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));margin-left:auto}.chat-item .chat-item-content-secondary{align-items:flex-start;display:flex;flex-direction:row;width:100%}.chat-item .chat-item-content-secondary-nickname{font-size:var(--text-base);-webkit-line-clamp:1;line-height:var(--tw-leading,var(--text-base--line-height));-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.chat-item .chat-item-content-secondary-message{color:var(--color-gray-600);font-size:var(--text-sm);-webkit-line-clamp:1;line-height:var(--tw-leading,var(--text-sm--line-height));-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.chat-item .chat-item-content-unread{background-color:var(--color-primary);border-radius:3.40282e+38px;color:var(--color-white);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));margin-left:auto}.chat-item .chat-item-content-unread-mark{display:inline-block;height:calc(var(--spacing)2.5);width:calc(var(--spacing)2.5)}.chat-item .chat-item-content-unread-count{padding-block:calc(var(--spacing).5);padding-inline:calc(var(--spacing)2)}.z-icon-button{cursor:pointer;font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));--tw-font-weight:var(--font-weight-medium);align-items:center;border-radius:3.40282e+38px;display:inline-flex;font-weight:var(--font-weight-medium);justify-content:center;transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.z-icon-button:focus{--tw-outline-style:none;outline-style:none}.z-icon-button-primary{background-color:var(--color-primary);color:var(--color-white)}.z-icon-button-outlined{border-color:var(--color-primary);border-style:var(--tw-border-style);border-width:1px}.z-icon-button-outlined,.z-icon-button-text{color:var(--color-primary)}.z-icon-button-disabled{cursor:not-allowed;opacity:.5}.z-button{cursor:pointer;--tw-font-weight:var(--font-weight-medium);align-items:center;border-radius:3.40282e+38px;display:inline-flex;font-weight:var(--font-weight-medium);justify-content:center;transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.z-button:focus{--tw-outline-style:none;outline-style:none}.z-button-small{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));padding-block:calc(var(--spacing)1.5);padding-inline:calc(var(--spacing)2)}.z-button-medium{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)3)}.z-button-large{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height));padding-block:calc(var(--spacing)3);padding-inline:calc(var(--spacing)4)}.z-button-primary{background-color:var(--color-primary);color:var(--color-white)}.z-button-outlined{border-color:var(--color-primary);border-style:var(--tw-border-style);border-width:1px;color:var(--color-primary)}.z-button-disabled{cursor:not-allowed;opacity:.5}.z-button-text{margin-inline:calc(var(--spacing)2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.z-input-area-label{margin-bottom:calc(var(--spacing)1);--tw-font-weight:var(--font-weight-medium);display:block;font-weight:var(--font-weight-medium)}.z-input-area-input,.z-input-area-label{color:var(--color-surface);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.z-input-area-input{background-color:var(--color-paper);border-color:var(--color-surface);border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);width:100%;--tw-ring-color:var(--color-primary)}.z-input-area-input:focus{border-color:var(--color-primary);--tw-outline-style:none;outline-style:none}.z-input-area-error{color:var(--color-red-500);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));margin-top:calc(var(--spacing)1)}.z-input-label{margin-bottom:calc(var(--spacing)1);--tw-font-weight:var(--font-weight-medium);display:block;font-weight:var(--font-weight-medium)}.z-input,.z-input-label{color:var(--color-surface);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.z-input{background-color:var(--color-background);border-color:var(--color-divider);border-style:var(--tw-border-style);border-width:1px;padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);width:100%;--tw-ring-color:var(--color-primary);border-radius:3.40282e+38px}.z-input:focus{border-color:var(--color-primary);--tw-outline-style:none;outline-style:none}.z-input-error{color:var(--color-red-500);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));margin-top:calc(var(--spacing)1)}.z-select-input-label{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));margin-bottom:calc(var(--spacing)1);--tw-font-weight:var(--font-weight-medium);display:block;font-weight:var(--font-weight-medium)}.z-tag-or-status-item{align-items:center;border-radius:var(--radius-2xl);gap:calc(var(--spacing)2);padding-block:calc(var(--spacing)1.5);padding-inline:calc(var(--spacing)3);--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);display:inline-flex}.z-tag-or-status-item .z-tag-or-status-item-name{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));max-width:calc(var(--spacing)20)}.z-tag-or-status-item .z-tag-or-status-item-icon{border-radius:3.40282e+38px;height:calc(var(--spacing)4);width:calc(var(--spacing)4)}.z-context-input{align-items:stretch;display:flex;flex-direction:row;margin-block:calc(var(--spacing)1)}.z-context-input-key{background-color:var(--color-background);border-bottom-left-radius:var(--radius-3xl);border-color:var(--color-divider);border-style:var(--tw-border-style);border-top-left-radius:var(--radius-3xl);border-width:1px;color:var(--color-surface);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));max-height:6.4rem;min-height:2.4rem;padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);resize:none;width:100%;--tw-ring-color:var(--color-primary);flex:1}.z-context-input-key:focus{border-color:var(--color-primary);--tw-outline-style:none;outline-style:none}.z-context-input-value{background-color:var(--color-background);border-bottom-right-radius:var(--radius-3xl);border-color:var(--color-primary);border-style:var(--tw-border-style);border-top-right-radius:var(--radius-3xl);border-width:1px;color:var(--color-surface);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));max-height:6.4rem;min-height:2.4rem;padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);resize:none;width:100%;--tw-ring-color:var(--color-primary);flex:1}.z-context-input-value:focus{border-color:var(--color-primary);--tw-outline-style:none;outline-style:none}.z-text-with-link{color:var(--color-blue-600);text-decoration-line:underline}.z-button-group{display:inline-flex}.z-button-group-tab{border-radius:var(--radius-md);display:flex;gap:calc(var(--spacing)1);padding:calc(var(--spacing).5)!important}.z-button-group-item{border-style:var(--tw-border-style);cursor:pointer;--tw-font-weight:var(--font-weight-medium);align-items:center;border-width:1px;display:inline-flex;font-weight:var(--font-weight-medium);justify-content:center;transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.z-button-group-item:focus{--tw-outline-style:none;outline-style:none}.z-button-group-item-tab{align-items:center;border-radius:var(--radius-sm);display:flex;flex:1;flex-direction:column;gap:calc(var(--spacing)2);justify-content:center;padding:calc(var(--spacing)1)!important}.z-button-group-item-tab,.z-button-group-item-tab-selected{border-style:var(--tw-border-style)!important;border-width:0!important}.z-button-group-item-tab-selected{background-color:var(--color-white);--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.z-button-group-item-tab-unselected{border-style:var(--tw-border-style)!important;border-width:0!important}.z-button-group-small{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));padding-block:calc(var(--spacing)1.5);padding-inline:calc(var(--spacing)2)}.z-button-group-medium{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)3)}.z-button-group-large{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height));padding-block:calc(var(--spacing)3);padding-inline:calc(var(--spacing)4)}.z-button-group-item-first{border-bottom-left-radius:3.40282e+38px;border-top-left-radius:3.40282e+38px}.z-button-group-item-last{border-bottom-right-radius:3.40282e+38px;border-top-right-radius:3.40282e+38px}.z-button-group-item-middle{border-radius:0}.z-button-group-item-primary-selected{background-color:var(--color-primary);border-color:var(--color-primary);color:var(--color-white)}.z-button-group-item-primary-unselected{background-color:var(--color-white);border-color:var(--color-primary);color:var(--color-primary)}.z-button-group-item-outlined-selected{background-color:var(--color-primary);border-color:var(--color-primary);color:var(--color-white)}.z-button-group-item-outlined-unselected{background-color:#0000;border-color:var(--color-primary);color:var(--color-primary)}.z-button-group-item-disabled{cursor:not-allowed;opacity:.5}.z-button-group-item:not(:first-child){margin-left:-1px}}@layer utilities{.hidden{display:none}.hidden\!{display:none!important}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.bg-background{background-color:var(--color-background)}.bg-paper{background-color:var(--color-paper)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}[data-theme=light]{--color-primary:#e02848;--color-secondary:#023761;--color-background:#fff;--color-surface:#000;--color-paper:#f3f4f6;--color-divider:#e5e7eb;--color-theme-gray:#6b7280}[data-theme=dark]{--color-primary:#b50f30;--color-secondary:#fff;--color-background:#23292d;--color-surface:#fff;--color-paper:#374151;--color-divider:#4b5563;--color-theme-gray:#d1d5db}.scroll-container::-webkit-scrollbar{background:#0000001a;height:8px;width:8px}.scroll-container:active::-webkit-scrollbar,.scroll-container:hover::-webkit-scrollbar{background:#0003}.scroll-container:active::-webkit-scrollbar-thumb,.scroll-container:hover::-webkit-scrollbar-thumb{background:#0006;border-radius:4px}.bg-time-badge{background-color:#0000004d}@supports (color:color-mix(in lab,red,red)){.bg-time-badge{background-color:color-mix(in srgb,var(--color-surface)30%,transparent)}}.placeholder-surface::placeholder{color:var(--color-text-gray)}.z-width-100{width:100%}.z-width-90{width:90%}.z-width-75{width:75%}.z-width-50{width:50%}.z-width-25{width:25%}.z-width-0{width:0}.z-animate-width{transition-duration:.5s;transition-property:width;transition-timing-function:cubic-bezier(.4,0,.2,1)}.z-animate-grid-template-cols{transition:grid-template-rows .5s}[type=checkbox]{background-color:var(--color-gray-300);border-color:var(--color-gray-300);border-radius:4px;cursor:pointer}[type=checkbox]:checked,[type=checkbox]:indeterminate{background-color:var(--color-primary);border-color:var(--color-primary);border-radius:4px;cursor:pointer}[type=checkbox]:focus{offset:0;outline-offset:0;--tw-ring-color:var(--color-primary);outline:none}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.grid-cols-1{grid-template-columns:1fr}.grid-cols-1_3{grid-template-columns:1fr 3fr}.grid-cols-1_2_1{grid-template-columns:1fr 2fr 1fr}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{.relative{position:relative}.size-5{height:calc(var(--spacing)5);width:calc(var(--spacing)5)}.rotate-45{rotate:45deg}.text-blue-500{color:var(--color-blue-500)}.text-green-500{color:var(--color-green-500)}.text-primary{color:var(--color-primary)}.text-surface{color:var(--color-surface)}.text-theme-gray{color:var(--color-theme-gray)}.mb-2{margin-bottom:calc(var(--spacing)2)}.w-xl{width:var(--container-xl)}.w-xs{width:var(--container-xs)}.m-auto{margin:auto}.size-32{height:calc(var(--spacing)32);width:calc(var(--spacing)32)}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)2(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)2var(--tw-space-y-reverse))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.col-span-2{grid-column:span 2/span 2}.my-2{margin-block:calc(var(--spacing)2)}.container{width:100%}.bg-pink-100{background-color:var(--color-pink-100)}.text-black{color:var(--color-black)}.visible{visibility:visible}.-top-12{top:calc(var(--spacing)-12)}.-top-24{top:calc(var(--spacing)-24)}.mx-auto{margin-inline:auto}.mt-10{margin-top:calc(var(--spacing)10)}.mb-10{margin-bottom:calc(var(--spacing)10)}.inline-block{display:inline-block}.size-18{height:calc(var(--spacing)18);width:calc(var(--spacing)18)}.p-4{padding:calc(var(--spacing)4)}.px-4{padding-inline:calc(var(--spacing)4)}.pt-4{padding-top:calc(var(--spacing)4)}.pb-8{padding-bottom:calc(var(--spacing)8)}.mt-1{margin-top:calc(var(--spacing)1)}.line-clamp-3{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.size-3{height:calc(var(--spacing)3);width:calc(var(--spacing)3)}.size-4{height:calc(var(--spacing)4);width:calc(var(--spacing)4)}.size-8{height:calc(var(--spacing)8);width:calc(var(--spacing)8)}.max-w-3xs{max-width:var(--container-3xs)}.max-w-sm{max-width:var(--container-sm)}.cursor-pointer{cursor:pointer}.resize{resize:both}.rounded-br-\[0\]{border-bottom-right-radius:0}.rounded-bl-\[0\]{border-bottom-left-radius:0}.bg-black{background-color:var(--color-black)}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing)2)}.p-3{padding:calc(var(--spacing)3)}.px-3{padding-inline:calc(var(--spacing)3)}.py-2{padding-block:calc(var(--spacing)2)}.text-white{color:var(--color-white)}.underline{text-decoration-line:underline}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.absolute{position:absolute}.right-full{right:100%}.-bottom-2{bottom:calc(var(--spacing)-2)}.left-full{left:100%}.mr-2{margin-right:calc(var(--spacing)2)}.mb-0\.5{margin-bottom:calc(var(--spacing).5)}.mb-2\.5{margin-bottom:calc(var(--spacing)2.5)}.ml-2{margin-left:calc(var(--spacing)2)}.flex{display:flex}.size-6{height:calc(var(--spacing)6);width:calc(var(--spacing)6)}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.items-center{align-items:center}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.rounded-full{border-radius:3.40282e+38px}.bg-yellow-300{background-color:var(--color-yellow-300)}.pl-10{padding-left:calc(var(--spacing)10)}.text-left{text-align:left}.text-right{text-align:right}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.size-42{height:calc(var(--spacing)42);width:calc(var(--spacing)42)}.h-20{height:calc(var(--spacing)20)}.w-42{width:calc(var(--spacing)42)}.w-full{width:100%}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.border-primary{border-color:var(--color-primary)}.border-transparent{border-color:#0000}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.-right-0\.5{right:calc(var(--spacing)-.5)}.-bottom-0\.5{bottom:calc(var(--spacing)-.5)}.col-span-3{grid-column:span 3/span 3}.mt-2{margin-top:calc(var(--spacing)2)}.flex-wrap{flex-wrap:wrap}.gap-y-1{row-gap:calc(var(--spacing)1)}.border-b-\[0\.5px\]{border-bottom-style:var(--tw-border-style);border-bottom-width:.5px}.border-divider{border-color:var(--color-divider)}.pt-2{padding-top:calc(var(--spacing)2)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.whitespace-nowrap{white-space:nowrap}.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.fixed{position:fixed}.inset-0{inset:calc(var(--spacing)0)}.top-3{top:calc(var(--spacing)3)}.right-3{right:calc(var(--spacing)3)}.right-4{right:calc(var(--spacing)4)}.bottom-3{bottom:calc(var(--spacing)3)}.left-3{left:calc(var(--spacing)3)}.z-10{z-index:10}.z-80{z-index:80}.mt-4{margin-top:calc(var(--spacing)4)}.mt-6{margin-top:calc(var(--spacing)6)}.mb-4{margin-bottom:calc(var(--spacing)4)}.contents{display:contents}.grid{display:grid}.inline-flex{display:inline-flex}.aspect-square{aspect-ratio:1}.size-12{height:calc(var(--spacing)12);width:calc(var(--spacing)12)}.size-14{height:calc(var(--spacing)14);width:calc(var(--spacing)14)}.h-7{height:calc(var(--spacing)7)}.h-8{height:calc(var(--spacing)8)}.h-9{height:calc(var(--spacing)9)}.h-\[180px\]{height:180px}.h-\[220px\]{height:220px}.h-\[280px\]{height:280px}.h-full{height:100%}.w-7{width:calc(var(--spacing)7)}.w-8{width:calc(var(--spacing)8)}.w-9{width:calc(var(--spacing)9)}.w-\[200px\]{width:200px}.w-\[250px\]{width:250px}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.max-w-xs{max-width:var(--container-xs)}.flex-1{flex:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.resize-none{resize:none}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.gap-1{gap:calc(var(--spacing)1)}.gap-2{gap:calc(var(--spacing)2)}.gap-3{gap:calc(var(--spacing)3)}.gap-4{gap:calc(var(--spacing)4)}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-\[18px\]{border-radius:18px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-\[1\.5px\]{border-style:var(--tw-border-style);border-width:1.5px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-b-\[1\.5px\]{border-bottom-style:var(--tw-border-style);border-bottom-width:1.5px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-none{--tw-border-style:none;border-style:none}.border-current{border-color:currentColor}.border-red-500{border-color:var(--color-red-500)}.bg-slate-900\/40{background-color:#0f172b66}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities;/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/40{background-color:color-mix(in oklab,var(--color-slate-900)40%,transparent)}}.bg-slate-900\/60{background-color:#0f172b99}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/60{background-color:color-mix(in oklab,var(--color-slate-900)60%,transparent)}}.bg-surface{background-color:var(--color-surface)}.bg-transparent{background-color:#0000}.bg-white\/90{background-color:#ffffffe6}@supports (color:color-mix(in lab,red,red)){.bg-white\/90{background-color:color-mix(in oklab,var(--color-white)90%,transparent)}}.object-cover{object-fit:cover}.p-1{padding:calc(var(--spacing)1)}.p-5{padding:calc(var(--spacing)5)}.p-6{padding:calc(var(--spacing)6)}.px-2{padding-inline:calc(var(--spacing)2)}.px-6{padding-inline:calc(var(--spacing)6)}.px-8{padding-inline:calc(var(--spacing)8)}.py-1\.5{padding-block:calc(var(--spacing)1.5)}.py-3{padding-block:calc(var(--spacing)3)}.py-4{padding-block:calc(var(--spacing)4)}.py-12{padding-block:calc(var(--spacing)12)}.pr-16{padding-right:calc(var(--spacing)16)}.pb-2{padding-bottom:calc(var(--spacing)2)}.pl-2{padding-left:calc(var(--spacing)2)}.text-center{text-align:center}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-\[13px\]{font-size:13px}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-red-500{color:var(--color-red-500)}.text-slate-700{color:var(--color-slate-700)}.placeholder-surface::placeholder{color:var(--color-surface)}.opacity-0{opacity:0}.opacity-60{opacity:.6}.opacity-80{opacity:.8}.shadow,.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a)}.shadow,.shadow-sm,.shadow-xl{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a)}.ring-primary{--tw-ring-color:var(--color-primary)}.transition-all{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-colors{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-opacity{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.focus\:border-red-500:focus{border-color:var(--color-red-500)}.focus\:ring-0:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor)}.focus\:ring-0:focus,.focus\:ring-2:focus{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor)}.focus\:ring-red-200:focus{--tw-ring-color:var(--color-red-200)}.focus\:ring-red-500:focus{--tw-ring-color:var(--color-red-500)}.focus\:ring-slate-200:focus{--tw-ring-color:var(--color-slate-200)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}}@keyframes spin{to{transform:rotate(1turn)}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{.top-1\/2{top:50%}.right-2{right:calc(var(--spacing)2)}.mt-auto{margin-top:auto}.ml-auto{margin-left:auto}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.h-10{height:calc(var(--spacing)10)}.min-h-0{min-height:calc(var(--spacing)0)}.w-10{width:calc(var(--spacing)10)}.min-w-0{min-width:calc(var(--spacing)0)}.-translate-y-1\/2{--tw-translate-y:-50%;translate:var(--tw-translate-x)var(--tw-translate-y)}.gap-2\.5{gap:calc(var(--spacing)2.5)}.overflow-y-auto{overflow-y:auto}.bg-primary{background-color:var(--color-primary)}.py-2\.5{padding-block:calc(var(--spacing)2.5)}.pr-9{padding-right:calc(var(--spacing)9)}.break-words{overflow-wrap:break-word}.text-gray-400{color:var(--color-gray-400)}.focus\:border-primary:focus{border-color:var(--color-primary)}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-40:disabled{opacity:.4}.col-span-full{grid-column:1/-1}.h-16{height:calc(var(--spacing)16)}.w-16{width:calc(var(--spacing)16)}.auto-rows-auto{grid-auto-rows:auto}.content-start{align-content:flex-start}.p-1\.5{padding:calc(var(--spacing)1.5)}.inset-y-0{inset-block:calc(var(--spacing)0)}.size-10{height:calc(var(--spacing)10);width:calc(var(--spacing)10)}.h-40{height:calc(var(--spacing)40)}.h-\[200px\]{height:200px}.w-60{width:calc(var(--spacing)60)}.shrink-0{flex-shrink:0}.gap-1\.5{gap:calc(var(--spacing)1.5)}.self-end{align-self:flex-end}.border-surface{border-color:var(--color-surface)}.py-1{padding-block:calc(var(--spacing)1)}.py-10{padding-block:calc(var(--spacing)10)}.pb-1{padding-bottom:calc(var(--spacing)1)}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.whitespace-pre-line{white-space:pre-line}.text-slate-500{color:var(--color-slate-500)}.opacity-70{opacity:.7}.shadow-\[0_8px_24px_rgba$15\,23\,42\,0\.08$\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#0f172a14)}.shadow-\[0_8px_24px_rgba$15\,23\,42\,0\.08$\],.shadow-sm{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a)}.text-background{color:var(--color-background)}.text-yellow-500{color:var(--color-yellow-500)}.size-16{height:calc(var(--spacing)16);width:calc(var(--spacing)16)}.size-\[8px\]{height:8px;width:8px}.size-\[10px\]{height:10px;width:10px}.col-span-1{grid-column:span 1/span 1}.m-2{margin:calc(var(--spacing)2)}.mx-4{margin-inline:calc(var(--spacing)4)}.ml-0\.5{margin-left:calc(var(--spacing).5)}.w-1\/2{width:50%}.max-w-32{max-width:calc(var(--spacing)32)}.translate-y-0{--tw-translate-y:calc(var(--spacing)0)}.translate-y-0,.translate-y-full{translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-y-full{--tw-translate-y:100%}.bg-secondary{background-color:var(--color-secondary)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.text-green-700{color:var(--color-green-700)}.text-red-700{color:var(--color-red-700)}.capitalize{text-transform:capitalize}.opacity-100{opacity:1}}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@layer utilities{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}@property --tw-leading{syntax:"";inherits:false}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}/! tailwindcss v4.1.16 \| MIT License \| https://tailwindcss.com /@layer properties{}@layer base{}:host{display:block}.message-box-wrapper{display:flex;flex-direction:column}.message-box-no-selected-chat-box{color:var(--color-primary);display:grid;margin-block:auto;place-content:center;text-align:center}.message-box-syncing-message{display:flex;flex-direction:column;gap:calc(var(--spacing)2);margin-inline:auto;margin-top:calc(var(--spacing)4);pointer-events:none;width:fit-content;z-index:10}.message-box-container{flex:1;overflow-y:auto;scroll-behavior:smooth}:where(.message-box-container>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)2(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)2var(--tw-space-y-reverse))}.message-box-loading{color:var(--color-gray-400);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));text-align:center}.message-box-loading-icon{animation:var(--animate-spin);height:calc(var(--spacing)5);margin-inline:auto;width:calc(var(--spacing)5)}.message-box-time-wrapper{margin-block:calc(var(--spacing)2);text-align:center}.message-box-time{border-radius:var(--radius-xl);color:var(--color-theme-gray);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));padding-block:calc(var(--spacing)1);padding-inline:calc(var(--spacing)2)}.message-box-scroll-to-bottom{opacity:.5}.message-box-scroll-to-bottom,.message-box-token-wrapper{--tw-translate-x:-50%;left:50%;position:absolute;translate:var(--tw-translate-x)var(--tw-translate-y)}.message-box-token-wrapper{background-color:var(--color-primary);border-radius:var(--radius-2xl);color:var(--color-white);padding-block:calc(var(--spacing)2);padding-inline:calc(var(--spacing)4);pointer-events:none;white-space:nowrap;width:fit-content;z-index:10}@property --tw-space-x-reverse{syntax:"";inherits:false;initial-value:0}@property --tw-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"";inherits:false}@property --tw-ring-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"";inherits:false}@property --tw-inset-ring-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"";inherits:false;initial-value:0 0 #0000}@property --tw-font-weight{syntax:"";inherits:false}@property --tw-blur{syntax:"";inherits:false}@property --tw-brightness{syntax:"";inherits:false}@property --tw-contrast{syntax:"";inherits:false}@property --tw-grayscale{syntax:"";inherits:false}@property --tw-hue-rotate{syntax:"";inherits:false}@property --tw-invert{syntax:"";inherits:false}@property --tw-opacity{syntax:"";inherits:false}@property --tw-saturate{syntax:"";inherits:false}@property --tw-sepia{syntax:"";inherits:false}@property --tw-drop-shadow{syntax:"";inherits:false}@property --tw-drop-shadow-color{syntax:"";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"";inherits:false}@property --tw-border-style{syntax:"";inherits:false;initial-value:solid}@property --tw-space-y-reverse{syntax:"";inherits:false;initial-value:0}@property --tw-translate-x{syntax:"";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"";inherits:false;initial-value:0}@media (forced-colors:active){[type=checkbox]:checked,[type=radio]:checked{appearance:auto}[type=checkbox]:indeterminate{appearance:auto}}@media (hover:hover){.z-button-outlined:hover,.z-button-primary:hover,.z-icon-button-outlined:hover,.z-icon-button-primary:hover,.z-icon-button-text:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.z-button-group-item-tab:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.z-button-group-item-tab-unselected:hover{background-color:var(--color-white)}.z-button-group-item-primary-unselected:hover{--tw-brightness:brightness(95%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.z-button-group-item-outlined-unselected:hover{background-color:#e028481a}@supports (color:color-mix(in lab,red,red)){.z-button-group-item-outlined-unselected:hover{background-color:color-mix(in oklab,var(--color-primary)10%,transparent)}}.hover\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.group-hover\:opacity-100:is(:where(.group):hover ){opacity:1}.hover\:bg-background:hover{background-color:var(--color-background)}.hover\:bg-red-50:hover{background-color:var(--color-red-50)}.hover\:bg-slate-100:hover{background-color:var(--color-slate-100)}.hover\:bg-white:hover{background-color:var(--color-white)}.hover\:text-gray-600:hover{color:var(--color-gray-600)}.hover\:opacity-100:hover{opacity:1}}@media screen and (min-width:0){.z-max-height{height:calc(100vh - 56px)}}@media screen and (min-width:600px){.z-max-height{height:calc(100vh - 64px)}}@media (min-width:40rem){.container{max-width:40rem}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:min-w-0{min-width:calc(var(--spacing)0)}.sm\:flex-row{flex-direction:row}}@media (min-width:48rem){.container{max-width:48rem}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (min-width:64rem){.container{max-width:64rem}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}@media not all and (min-width:40rem){.max-sm\:hidden{display:none}}

package/dist/collection/components/message-box/message-box.js CHANGED Viewed

@@ -404,8 +404,8 @@ export class MessageBox {
         const { start, end } = this.visibleRange;
         const topSpacerHeight = useVirtualScrolling ? start * this.ESTIMATED_ITEM_HEIGHT : 0;
         const bottomSpacerHeight = useVirtualScrolling ? Math.max(0, (messages.length - end) * this.ESTIMATED_ITEM_HEIGHT) : 0;
-        return (h(Host, { key: '2974551d98954efc1d6612ba1892436d49a8a8fa', "data-theme": theme }, selectedChat === null ? (h("div", { class: "message-box-wrapper z-max-height" }, h("div", { class: "message-box-no-selected-chat-box text-accent" }, h("div", { class: "mx-auto" }, h(Icon, { name: "MessageSquareText", addClass: "size-18" })), isNotConnected ? t('chat_tab.you_not_connect_chat') : t('chat_tab.please_choose_chat_to_reply'), isNotConnected && h(ZButton, { startIcon: h(Icon, { name: "Plus" }), label: t('chat_tab.add_connection'), id: "connect-channel" })))) : (h("div", { class: "message-box-wrapper z-max-height" }, h("chat-header", null), (selectedChatStore.get('isSyncingMessage') || selectedChatStore.get('isSyncingTag')) && (h("div", { class: "message-box-syncing-message" }, selectedChatStore.get('isSyncingMessage') && h("status-badge", { status: "loading", label: t('chat_tab.syncing_message') }), selectedChatStore.get('isSyncingTag') && h("status-badge", { status: "loading", label: t('chat_tab.syncing_tag') }))), h("div", { class: `message-box-container scroll-container ${isReplyTokenInfo ? 'pb-8 pt-4 px-4' : 'p-4'}`, id: `message-box-${selectedChat.id}`, ref: el => (this.scrollContainer = el), onScroll: this.handleScroll }, this.isLoadingTop && (h("div", { id: "loading-top", class: "message-box-loading mb-10" }, h(Icon, { name: "LoaderCircle", addClass: "message-box-loading-icon" }))), topSpacerHeight > 0 && h("div", { style: { height: `${topSpacerHeight}px` } }), Object.entries(visibleGroupedByDate).map(([date, items]) => [
-            h("div", { key: `time-${date}`, class: "message-box-time-wrapper" }, h("span", { class: "message-box-time text-gray bg-time-badge" }, dayjs().tz().format('DD MMM YYYY') === date ? t('today') : date)),
+        return (h(Host, { key: '2974551d98954efc1d6612ba1892436d49a8a8fa', "data-theme": theme }, selectedChat === null ? (h("div", { class: "message-box-wrapper z-max-height" }, h("div", { class: "message-box-no-selected-chat-box" }, h("div", { class: "mx-auto" }, h(Icon, { name: "MessageSquareText", addClass: "size-18" })), isNotConnected ? t('chat_tab.you_not_connect_chat') : t('chat_tab.please_choose_chat_to_reply'), isNotConnected && h(ZButton, { startIcon: h(Icon, { name: "Plus" }), label: t('chat_tab.add_connection'), id: "connect-channel" })))) : (h("div", { class: "message-box-wrapper z-max-height" }, h("chat-header", null), (selectedChatStore.get('isSyncingMessage') || selectedChatStore.get('isSyncingTag')) && (h("div", { class: "message-box-syncing-message" }, selectedChatStore.get('isSyncingMessage') && h("status-badge", { status: "loading", label: t('chat_tab.syncing_message') }), selectedChatStore.get('isSyncingTag') && h("status-badge", { status: "loading", label: t('chat_tab.syncing_tag') }))), h("div", { class: `message-box-container scroll-container ${isReplyTokenInfo ? 'pb-8 pt-4 px-4' : 'p-4'}`, id: `message-box-${selectedChat.id}`, ref: el => (this.scrollContainer = el), onScroll: this.handleScroll }, this.isLoadingTop && (h("div", { id: "loading-top", class: "message-box-loading mb-10" }, h(Icon, { name: "LoaderCircle", addClass: "message-box-loading-icon" }))), topSpacerHeight > 0 && h("div", { style: { height: `${topSpacerHeight}px` } }), Object.entries(visibleGroupedByDate).map(([date, items]) => [
+            h("div", { key: `time-${date}`, class: "message-box-time-wrapper" }, h("span", { class: "message-box-time bg-time-badge" }, dayjs().tz().format('DD MMM YYYY') === date ? t('today') : date)),
             ...items.map(item => (h("message-item", { key: item.id, item: item })))
         ]), bottomSpacerHeight > 0 && h("div", { style: { height: `${bottomSpacerHeight}px` } }), this.isLoadingBottom && (h("div", { id: "loading-bottom", class: "message-box-loading mt-10" }, h(Icon, { name: "LoaderCircle", addClass: "message-box-loading-icon" })))), h("div", { class: "relative" }, !this.isAtBottom && (h("div", { class: `message-box-scroll-to-bottom ${isReplyTokenInfo ? '-top-24' : '-top-12'}` }, h(ZIconButton, { iconName: "ArrowDown", onClick: () => this.scrollToBottom(true) }))), isReplyTokenInfo &&
             (() => {
@@ -415,7 +415,7 @@ export class MessageBox {
                 const parts = replacedTotal.split('{remaining}');
                 const before = parts[0] || '';
                 const after = parts[1] || '';
-                return (h("div", { class: "message-box-token-wrapper bg-accent", style: { bottom: 'calc(100% + 8px)' } }, h("span", null, before), h("span", { ref: el => {
+                return (h("div", { class: "message-box-token-wrapper", style: { bottom: 'calc(100% + 8px)' } }, h("span", null, before), h("span", { ref: el => {
                         this.replyTokenSpan = el;
                         this.updateReplyTokenRemainingDOM();
                     }, style: { minWidth: '4ch', display: 'inline-block', textAlign: 'center' } }), h("span", null, after)));

package/dist/collection/components/message-box/message-box.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"message-box.js","sourceRoot":"","sources":["../../../src/components/message-box/message-box.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, State, h, Event, EventEmitter, Element, Listen } from '@stencil/core';\nimport { chatsStore, configStore, messagesStore, selectedChatStore } from '../../store/store';\nimport { useTranslation } from '../../utils/utils';\nimport { Icon } from '../internal-component/icon';\nimport { initSocket, joinRoom, leaveRoom } from '../../utils/socket';\nimport { ChannelType, ChatMessageItem, ChatRead, TChatItem } from '../../store/type';\nimport {\n getOrFetchTranslation,\n handleGetChatMessages,\n handleMapReadMessage,\n serviceReadMessage,\n initDB,\n serviceUpdateChatItem,\n serviceUpdateMessageItems,\n} from '../../store/message';\nimport { getReplyTokenInfo } from '../../api';\nimport { GetReplyTokenInfoResponse } from '../../api/type';\nimport groupBy from 'lodash/groupBy';\nimport { displayLongDate } from '../../utils/dayjs';\nimport { ZButton } from '../internal-component/z-button';\nimport dayjs from 'dayjs';\nimport { ZIconButton } from '../internal-component/z-icon-button';\nimport { handleError } from '../../store/dialog';\n\n@Component({\n tag: 'message-box',\n styleUrl: 'message-box.css',\n})\nexport class MessageBox {\n @Element() hostElement!: HTMLElement;\n\n private disposeListener: () => void;\n private replyTokenTimer?: number;\n\n @Event({ bubbles: true, composed: true }) focusRequested!: EventEmitter;\n\n @Listen('click')\n handleClick() {\n this.handleReadMessage();\n }\n\n @State() isInitial = false;\n @State() isLoadingTop = false;\n @State() isLoadingBottom = false;\n @State() isAtBottom: boolean = true;\n @State() replyTokenInfo: GetReplyTokenInfoResponse \| null = null;\n @State() showReplyTokenBanner: boolean = false;\n private scrollContainer?: HTMLDivElement;\n private prevSelectedChat: TChatItem \| null = null;\n private replyTokenSpan?: HTMLSpanElement;\n private lastScrollTop: number = 0;\n private scrollDirection: 'up' \| 'down' \| null = null;\n\n // Memoization cache for grouped messages\n private cachedGroupedMessages: Record<string, ChatMessageItem[]> \| null = null;\n private cachedMessagesLength: number = 0;\n private cachedMessageIds: string = '';\n\n // Enable virtual scrolling to reduce DOM nodes for large message lists\n private readonly ENABLE_VIRTUAL_SCROLLING = true;\n @State() private visibleRange: { start: number; end: number } = { start: 0, end: 0 };\n private readonly BUFFER_SIZE = 3; // Extra items to render above/below viewport (reduced from 5 for optimal performance)\n private readonly ESTIMATED_ITEM_HEIGHT = 72; // Average message height in pixels\n private readonly VIRTUAL_SCROLL_THRESHOLD = 30; // Only use virtual scrolling when > 30 messages (reduced from 150 for better performance)\n\n /*\n Calculate which messages should be visible based on scroll position\n * Virtual scrolling: Only render messages in viewport + buffer\n /\n private updateVisibleRange(scrollTop: number, clientHeight: number, totalMessages: number) {\n const viewportStart = Math.floor(scrollTop / this.ESTIMATED_ITEM_HEIGHT);\n const viewportEnd = Math.ceil((scrollTop + clientHeight) / this.ESTIMATED_ITEM_HEIGHT);\n\n const start = Math.max(0, viewportStart - this.BUFFER_SIZE);\n const end = Math.min(totalMessages, viewportEnd + this.BUFFER_SIZE);\n\n // Only update if range changed significantly (avoid unnecessary re-renders)\n if (Math.abs(this.visibleRange.start - start) > 5 \|\| Math.abs(this.visibleRange.end - end) > 5) {\n this.visibleRange = { start, end };\n }\n }\n\n /\n Get only visible messages from grouped messages\n * Reduces DOM nodes by only rendering what's in viewport\n /\n private getVisibleGroupedMessages(groupedByDate: Record<string, ChatMessageItem[]>): Record<string, ChatMessageItem[]> {\n const { start, end } = this.visibleRange;\n // eslint-disable-next-line no-unused-vars\n const allMessages = Object.entries(groupedByDate).flatMap(([_, items]) => items);\n const visibleMessages = allMessages.slice(start, end);\n\n // Re-group visible messages by date\n const visibleGrouped: Record<string, ChatMessageItem[]> = {};\n for (const message of visibleMessages) {\n const date = displayLongDate(message.message_at);\n if (!visibleGrouped[date]) {\n visibleGrouped[date] = [];\n }\n visibleGrouped[date].push(message);\n }\n\n return visibleGrouped;\n }\n\n /\n Memoized message grouping - only recalculates when messages actually change\n * Performance: Reduces 60fps operations to ~1-5 per second (when messages update)\n /\n private getGroupedMessages(messages: ChatMessageItem[]): Record<string, ChatMessageItem[]> {\n // Quick check: If length hasn't changed and IDs match, return cached\n const messageIds = messages.map(m => m.id).join(',');\n\n if (this.cachedGroupedMessages && messages.length === this.cachedMessagesLength && messageIds === this.cachedMessageIds) {\n return this.cachedGroupedMessages;\n }\n\n // Recalculate: Sort and group messages\n const sorted = [...messages].sort((a, b) => (dayjs(a.message_at).isBefore(dayjs(b.message_at)) ? -1 : 1));\n\n const grouped = groupBy(sorted, item => displayLongDate(item.message_at));\n\n // Update cache\n this.cachedGroupedMessages = grouped;\n this.cachedMessagesLength = messages.length;\n this.cachedMessageIds = messageIds;\n\n return grouped;\n }\n\n componentDidLoad() {\n initDB();\n this.scrollToBottom();\n }\n\n private handleReadMessage = async () => {\n const selectedChat = selectedChatStore.get('selectedChat');\n if (!selectedChat) return;\n const matchChat = chatsStore.get('chats').find(item => item.id === selectedChat?.id);\n if (!matchChat) return;\n if (matchChat.unread_count > 0) {\n await serviceReadMessage(selectedChat.id);\n }\n };\n\n private scrollToBottom(isSmooth?: boolean) {\n if (this.scrollContainer) {\n setTimeout(() => {\n this.scrollContainer.scrollTo({\n top: this.scrollContainer.scrollHeight,\n behavior: isSmooth ? 'smooth' : 'instant',\n });\n }, 100);\n }\n }\n\n private async fetchReplyTokenInfo(sessionId: string, channel: ChannelType) {\n if (channel !== 'line') return;\n try {\n const info = await getReplyTokenInfo({ sessionId });\n this.replyTokenInfo = info;\n this.startReplyTokenTimer();\n } catch (error: unknown) {\n handleError(error, 'Failed to get reply token info');\n }\n }\n\n // private async handleSetChatLanguage(sessionId: string, newChat: TChatItem, newLanguage: string) {\n // const language = newLanguage;\n // const { code } = await updateChat({ sessionId, language })\n // if (code === 'chat-updated') {\n // const readChats = chatsStore.get('chats').map((chat) => {\n // if (chat.id === sessionId) {\n // return { ...chat, language };\n // }\n // return chat;\n // })\n\n // chatsStore.set('chats', readChats);\n // selectedChatStore.set('selectedChat', { ...newChat, language });\n // }\n // }\n\n private handleSocketEvents() {\n const socket = initSocket();\n const selectedChat = selectedChatStore.get('selectedChat');\n const chatId = selectedChat.id;\n joinRoom(chatId);\n\n socket.on('message', async (message: ChatMessageItem) => {\n try {\n const messageId = message.id;\n const existChatIdx = messagesStore.get('messages').findIndex(item => item.id === messageId);\n if (existChatIdx !== -1) return;\n\n let translatedMessage = message;\n const translationSettings = configStore.get('translationSettings');\n if (\n translationSettings.is_auto &&\n selectedChat.language !== translationSettings.target_language &&\n !translationSettings.exclude_languages.includes(selectedChat.language)\n ) {\n if (message.text) {\n const translatedResponse = await getOrFetchTranslation({\n chat_id: chatId,\n message_ids: [messageId],\n });\n\n translatedMessage = {\n ...message,\n translatedText: translatedResponse?.text \|\| message.translatedText,\n };\n } else {\n translatedMessage = message;\n }\n }\n\n serviceUpdateMessageItems({ updateMessages: [translatedMessage], clearSending: true });\n\n // serviceUpdateChatItem({\n // chatId,\n // updateValue: {\n // last_message: message.text,\n // last_message_at: message.message_at,\n // },\n // });\n this.fetchReplyTokenInfo(chatId, selectedChat.channel);\n this.scrollToBottom();\n } catch (error: unknown) {\n handleError(error, 'Failed to process message from socket');\n }\n });\n\n socket.on('read', (chatRead: ChatRead) => {\n try {\n if (chatRead) {\n const chatId = chatRead.id;\n\n serviceUpdateChatItem({\n chatId,\n updateValue: {\n unread_count: 0,\n updated_at: chatRead.read_at,\n },\n });\n\n const reads = messagesStore.get('reads');\n const readIndex = reads.findIndex(item => item.id === chatId);\n if (readIndex !== -1) {\n reads[readIndex] = chatRead;\n } else {\n reads.push(chatRead);\n }\n\n messagesStore.set('reads', reads);\n handleMapReadMessage();\n }\n } catch (error: unknown) {\n handleError(error, 'Failed to process read message event');\n }\n });\n\n // Deprecate backend will check and update automatically\n // socket.on('language', (detectedLanguage: { language?: string }) => {\n // this.handleSetChatLanguage(chatId, selectedChat, detectedLanguage.language)\n // });\n }\n\n private handleResetMessageCache = () => {\n messagesStore.reset();\n this.prevSelectedChat = null;\n // Clear render immediately\n this.cachedGroupedMessages = null;\n this.cachedMessagesLength = 0;\n this.cachedMessageIds = '';\n this.visibleRange = { start: 0, end: 0 };\n }\n\n async componentWillLoad() {\n this.disposeListener = selectedChatStore.onChange('selectedChat', async newChat => {\n if (!newChat) {\n this.handleResetMessageCache();\n return;\n }\n\n const sessionId = newChat.id;\n\n if (newChat.id !== this.prevSelectedChat?.id) {\n // IMPORTANT: Clear everything FIRST to remove old DOM nodes immediately\n this.handleResetMessageCache();\n\n selectedChatStore.set('isSyncingMessage', false);\n selectedChatStore.set('isSyncingTag', false);\n\n // reset reply token info when switching chats\n if (this.replyTokenTimer) window.clearInterval(this.replyTokenTimer);\n this.replyTokenInfo = null;\n this.showReplyTokenBanner = false;\n\n // if (newChat.language === null) {\n // await this.handleSetChatLanguage(sessionId, newChat, configStore.get('translationSettings').target_language)\n // }\n\n await this.loadMessages({});\n\n // After messages loaded, clamp visibleRange to the most recent chunk when using virtual scroll.\n const messages = messagesStore.get('messages');\n const total = messages.length;\n if (this.ENABLE_VIRTUAL_SCROLLING && total > this.VIRTUAL_SCROLL_THRESHOLD) {\n const CHUNK = 50; // number of recent messages to render initially (reduced from 200 for faster initial render)\n const start = Math.max(0, total - CHUNK);\n this.visibleRange = { start, end: total };\n } else {\n this.visibleRange = { start: 0, end: Math.max(50, total) };\n }\n\n this.prevSelectedChat = newChat;\n this.focusRequested.emit();\n\n await this.fetchReplyTokenInfo(sessionId, newChat.channel);\n\n this.isInitial = true;\n this.scrollToBottom();\n\n this.handleSocketEvents();\n }\n\n //Always read message when click\n // if (newChat.unread_count > 0) {\n await serviceReadMessage(sessionId);\n // }\n });\n }\n\n disconnectedCallback() {\n this.disposeListener?.();\n if (this.replyTokenTimer) window.clearInterval(this.replyTokenTimer);\n const selectedChat = selectedChatStore.get('selectedChat');\n if (selectedChat) {\n leaveRoom(selectedChat.id);\n }\n }\n\n private updateReplyTokenRemainingDOM() {\n if (!this.replyTokenInfo?.expired_at) return;\n const now = new Date();\n const expiredAt = new Date(this.replyTokenInfo.expired_at);\n const diffMs = expiredAt.getTime() - now.getTime();\n\n if (diffMs <= 0) {\n if (this.replyTokenTimer) window.clearInterval(this.replyTokenTimer);\n this.replyTokenInfo = null; // reset when expired\n this.showReplyTokenBanner = false;\n return;\n }\n\n const totalSeconds = Math.floor(diffMs / 1000);\n const minutes = Math.floor(totalSeconds / 60);\n const seconds = totalSeconds % 60;\n const minutesStr = minutes.toString().padStart(2, '0');\n const secondsStr = seconds.toString().padStart(2, '0');\n const remaining = `${minutesStr}:${secondsStr}`;\n if (this.replyTokenSpan) {\n this.replyTokenSpan.textContent = remaining;\n }\n }\n\n private startReplyTokenTimer() {\n if (!this.replyTokenInfo) return;\n if (this.replyTokenTimer) window.clearInterval(this.replyTokenTimer);\n this.showReplyTokenBanner = (this.replyTokenInfo.total \|\| 0) > 0;\n // prime the DOM value once and then tick\n requestAnimationFrame(() => this.updateReplyTokenRemainingDOM());\n this.replyTokenTimer = window.setInterval(() => this.updateReplyTokenRemainingDOM(), 1000);\n }\n\n private async loadMessages({ startMessageId, next, prev, isNewer = false }: { startMessageId?: string; next?: string; prev?: string; isNewer?: boolean }) {\n if (this.isLoadingTop \|\| this.isLoadingBottom) return;\n\n try {\n if (prev) {\n this.isLoadingBottom = true;\n } else {\n this.isLoadingTop = true;\n }\n\n await handleGetChatMessages({\n startMessageId,\n next,\n prev,\n isNewer,\n });\n } catch (error: unknown) {\n handleError(error, 'Failed to load chat messages');\n } finally {\n if (prev) {\n this.isLoadingBottom = false;\n } else {\n this.isLoadingTop = false;\n }\n }\n }\n\n private handleScroll = async () => {\n const element = this.scrollContainer;\n if (!element) return;\n\n const threshold = 100;\n const { scrollTop, scrollHeight, clientHeight } = element;\n\n // Update visible range for virtual scrolling\n const totalMessages = messagesStore.get('messages').length;\n this.updateVisibleRange(scrollTop, clientHeight, totalMessages);\n\n //Detect scroll direction\n if (scrollTop > this.lastScrollTop) {\n this.scrollDirection = 'down';\n } else if (scrollTop < this.lastScrollTop) {\n this.scrollDirection = 'up';\n }\n this.lastScrollTop = scrollTop <= 0 ? 0 : scrollTop;\n\n //Check bottom\n this.isAtBottom = scrollTop + clientHeight >= scrollHeight;\n if (this.isAtBottom) return;\n\n const jumpMessageId = messagesStore.get('jumpMessageId');\n\n //Is Scroll up and Near top → Load older messages\n if (this.scrollDirection === 'up') {\n const olderNextKey = messagesStore.get('older')?.next;\n const isNearTop = scrollTop < threshold;\n if (isNearTop && olderNextKey && !jumpMessageId) {\n await this.loadMessages({ next: olderNextKey });\n return;\n }\n }\n\n //Is Scroll down and Near bottom → Load newer messages\n if (this.scrollDirection === 'down') {\n const prevKey = messagesStore.get('newer')?.prev;\n const olderPrevKey = messagesStore.get('older')?.prev;\n const isNearBottom = scrollTop + clientHeight > scrollHeight - threshold;\n if (isNearBottom && (prevKey \|\| olderPrevKey) && !jumpMessageId) {\n await this.loadMessages({ prev: prevKey \|\| olderPrevKey, isNewer: true });\n return;\n }\n }\n };\n\n render() {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const messages = messagesStore.get('messages');\n const selectedChat = selectedChatStore.get('selectedChat');\n const isNotConnected = configStore.get('isNotConnected');\n // Use memoized grouping - only recalculates when messages change\n const groupedByDate = this.getGroupedMessages(messages);\n\n // Virtual scrolling - only enabled if flag is true and message count exceeds threshold\n const useVirtualScrolling = this.ENABLE_VIRTUAL_SCROLLING && messages.length > this.VIRTUAL_SCROLL_THRESHOLD;\n const visibleGroupedByDate = useVirtualScrolling ? this.getVisibleGroupedMessages(groupedByDate) : groupedByDate;\n\n const isReplyTokenInfo = this.showReplyTokenBanner;\n\n // Calculate spacer heights for virtual scrolling (only if enabled)\n const { start, end } = this.visibleRange;\n const topSpacerHeight = useVirtualScrolling ? start this.ESTIMATED_ITEM_HEIGHT : 0;\n const bottomSpacerHeight = useVirtualScrolling ? Math.max(0, (messages.length - end) * this.ESTIMATED_ITEM_HEIGHT) : 0;\n\n return (\n <Host data-theme={theme}>\n {selectedChat === null ? (\n <div class=\"message-box-wrapper z-max-height\">\n <div class=\"message-box-no-selected-chat-box text-accent\">\n <div class=\"mx-auto\">\n <Icon name=\"MessageSquareText\" addClass=\"size-18\" />\n </div>\n {isNotConnected ? t('chat_tab.you_not_connect_chat') : t('chat_tab.please_choose_chat_to_reply')}\n {isNotConnected && <ZButton startIcon={<Icon name=\"Plus\" />} label={t('chat_tab.add_connection')} id=\"connect-channel\" />}\n </div>\n </div>\n ) : (\n <div class=\"message-box-wrapper z-max-height\">\n <chat-header />\n {(selectedChatStore.get('isSyncingMessage') \|\| selectedChatStore.get('isSyncingTag')) && (\n <div class=\"message-box-syncing-message\">\n {selectedChatStore.get('isSyncingMessage') && <status-badge status=\"loading\" label={t('chat_tab.syncing_message')} />}\n {selectedChatStore.get('isSyncingTag') && <status-badge status=\"loading\" label={t('chat_tab.syncing_tag')} />}\n </div>\n )}\n <div\n class={`message-box-container scroll-container ${isReplyTokenInfo ? 'pb-8 pt-4 px-4' : 'p-4'}`}\n id={`message-box-${selectedChat.id}`}\n ref={el => (this.scrollContainer = el)}\n onScroll={this.handleScroll}\n >\n {this.isLoadingTop && (\n <div id=\"loading-top\" class=\"message-box-loading mb-10\">\n <Icon name=\"LoaderCircle\" addClass=\"message-box-loading-icon\" />\n </div>\n )}\n {/* Top spacer for virtual scrolling /}\n {topSpacerHeight > 0 && <div style={{ height: `${topSpacerHeight}px` }} />}\n\n {/ Render only visible messages /}\n {Object.entries(visibleGroupedByDate).map(([date, items]) => [\n <div key={`time-${date}`} class=\"message-box-time-wrapper\">\n <span class=\"message-box-time text-gray bg-time-badge\">\n {dayjs().tz().format('DD MMM YYYY') === date ? t('today') : date}\n </span>\n </div>,\n ...items.map(item => (\n <message-item key={item.id} item={item} />\n ))\n ])}\n\n {/ Bottom spacer for virtual scrolling */}\n {bottomSpacerHeight > 0 && <div style={{ height: `${bottomSpacerHeight}px` }} />}\n\n {this.isLoadingBottom && (\n <div id=\"loading-bottom\" class=\"message-box-loading mt-10\">\n <Icon name=\"LoaderCircle\" addClass=\"message-box-loading-icon\" />\n </div>\n )}\n </div>\n <div class=\"relative\">\n {!this.isAtBottom && (\n <div class={`message-box-scroll-to-bottom ${isReplyTokenInfo ? '-top-24' : '-top-12'}`}>\n <ZIconButton iconName=\"ArrowDown\" onClick={() => this.scrollToBottom(true)} />\n </div>\n )}\n {isReplyTokenInfo &&\n (() => {\n const template = t('chat_tab.reply_token_info');\n const totalStr = String(this.replyTokenInfo?.total ?? 0);\n const replacedTotal = template.replace('{total}', totalStr);\n const parts = replacedTotal.split('{remaining}');\n const before = parts[0] \|\| '';\n const after = parts[1] \|\| '';\n return (\n <div\n class=\"message-box-token-wrapper bg-accent\"\n style={{ bottom: 'calc(100% + 8px)' }}\n >\n <span>{before}</span>\n <span\n ref={el => {\n this.replyTokenSpan = el;\n this.updateReplyTokenRemainingDOM();\n }}\n style={{ minWidth: '4ch', display: 'inline-block', textAlign: 'center' }}\n ></span>\n <span>{after}</span>\n </div>\n );\n })()}\n <chat-input />\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"message-box.js","sourceRoot":"","sources":["../../../src/components/message-box/message-box.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAgB,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAChG,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAC9F,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAErE,OAAO,EACL,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,kBAAkB,EAClB,MAAM,EACN,qBAAqB,EACrB,yBAAyB,GAC1B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAE9C,OAAO,OAAO,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AACzD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAMjD,MAAM,OAAO,UAAU;IACV,WAAW,CAAe;IAE7B,eAAe,CAAa;IAC5B,eAAe,CAAU;IAES,cAAc,CAAgB;IAGxE,WAAW;QACT,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAEQ,SAAS,GAAG,KAAK,CAAC;IAClB,YAAY,GAAG,KAAK,CAAC;IACrB,eAAe,GAAG,KAAK,CAAC;IACxB,UAAU,GAAY,IAAI,CAAC;IAC3B,cAAc,GAAqC,IAAI,CAAC;IACxD,oBAAoB,GAAY,KAAK,CAAC;IACvC,eAAe,CAAkB;IACjC,gBAAgB,GAAqB,IAAI,CAAC;IAC1C,cAAc,CAAmB;IACjC,aAAa,GAAW,CAAC,CAAC;IAC1B,eAAe,GAAyB,IAAI,CAAC;IAErD,yCAAyC;IACjC,qBAAqB,GAA6C,IAAI,CAAC;IACvE,oBAAoB,GAAW,CAAC,CAAC;IACjC,gBAAgB,GAAW,EAAE,CAAC;IAEtC,uEAAuE;IACtD,wBAAwB,GAAG,IAAI,CAAC;IAChC,YAAY,GAAmC,EAAE,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC;IACpE,WAAW,GAAG,CAAC,CAAC,CAAC,sFAAsF;IACvG,qBAAqB,GAAG,EAAE,CAAC,CAAC,mCAAmC;IAC/D,wBAAwB,GAAG,EAAE,CAAC,CAAC,0FAA0F;IAE1I;;;OAGG;IACK,kBAAkB,CAAC,SAAiB,EAAE,YAAoB,EAAE,aAAqB;QACvF,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC;QACzE,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,YAAY,CAAC,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC;QAEvF,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC;QAC5D,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC;QAEpE,4EAA4E;QAC5E,IAAI,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,KAAK,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YAC/F,IAAI,CAAC,YAAY,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;QACrC,CAAC;IACH,CAAC;IAED;;;OAGG;IACK,yBAAyB,CAAC,aAAgD;QAChF,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,YAAY,CAAC;QACzC,0CAA0C;QAC1C,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC;QACjF,MAAM,eAAe,GAAG,WAAW,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEtD,oCAAoC;QACpC,MAAM,cAAc,GAAsC,EAAE,CAAC;QAC7D,KAAK,MAAM,OAAO,IAAI,eAAe,EAAE,CAAC;YACtC,MAAM,IAAI,GAAG,eAAe,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;YACjD,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC;gBAC1B,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC;YAC5B,CAAC;YACD,cAAc,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACrC,CAAC;QAED,OAAO,cAAc,CAAC;IACxB,CAAC;IAED;;;OAGG;IACK,kBAAkB,CAAC,QAA2B;QACpD,qEAAqE;QACrE,MAAM,UAAU,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAErD,IAAI,IAAI,CAAC,qBAAqB,IAAI,QAAQ,CAAC,MAAM,KAAK,IAAI,CAAC,oBAAoB,IAAI,UAAU,KAAK,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxH,OAAO,IAAI,CAAC,qBAAqB,CAAC;QACpC,CAAC;QAED,uCAAuC;QACvC,MAAM,MAAM,GAAG,CAAC,GAAG,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAE1G,MAAM,OAAO,GAAG,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;QAE1E,eAAe;QACf,IAAI,CAAC,qBAAqB,GAAG,OAAO,CAAC;QACrC,IAAI,CAAC,oBAAoB,GAAG,QAAQ,CAAC,MAAM,CAAC;QAC5C,IAAI,CAAC,gBAAgB,GAAG,UAAU,CAAC;QAEnC,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,gBAAgB;QACd,MAAM,EAAE,CAAC;QACT,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAEO,iBAAiB,GAAG,KAAK,IAAI,EAAE;QACrC,MAAM,YAAY,GAAG,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;QAC3D,IAAI,CAAC,YAAY;YAAE,OAAO;QAC1B,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,YAAY,EAAE,EAAE,CAAC,CAAC;QACrF,IAAI,CAAC,SAAS;YAAE,OAAO;QACvB,IAAI,SAAS,CAAC,YAAY,GAAG,CAAC,EAAE,CAAC;YAC/B,MAAM,kBAAkB,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;QAC5C,CAAC;IACH,CAAC,CAAC;IAEM,cAAc,CAAC,QAAkB;QACvC,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC;oBAC5B,GAAG,EAAE,IAAI,CAAC,eAAe,CAAC,YAAY;oBACtC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;iBAC1C,CAAC,CAAC;YACL,CAAC,EAAE,GAAG,CAAC,CAAC;QACV,CAAC;IACH,CAAC;IAEO,KAAK,CAAC,mBAAmB,CAAC,SAAiB,EAAE,OAAoB;QACvE,IAAI,OAAO,KAAK,MAAM;YAAE,OAAO;QAC/B,IAAI,CAAC;YACH,MAAM,IAAI,GAAG,MAAM,iBAAiB,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC;YACpD,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;YAC3B,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC9B,CAAC;QAAC,OAAO,KAAc,EAAE,CAAC;YACxB,WAAW,CAAC,KAAK,EAAE,gCAAgC,CAAC,CAAC;QACvD,CAAC;IACH,CAAC;IAED,oGAAoG;IACpG,kCAAkC;IAClC,+DAA+D;IAC/D,mCAAmC;IACnC,gEAAgE;IAChE,qCAAqC;IACrC,wCAAwC;IACxC,UAAU;IACV,qBAAqB;IACrB,SAAS;IAET,0CAA0C;IAC1C,uEAAuE;IACvE,MAAM;IACN,IAAI;IAEI,kBAAkB;QACxB,MAAM,MAAM,GAAG,UAAU,EAAE,CAAC;QAC5B,MAAM,YAAY,GAAG,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;QAC3D,MAAM,MAAM,GAAG,YAAY,CAAC,EAAE,CAAC;QAC/B,QAAQ,CAAC,MAAM,CAAC,CAAC;QAEjB,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,KAAK,EAAE,OAAwB,EAAE,EAAE;YACtD,IAAI,CAAC;gBACH,MAAM,SAAS,GAAG,OAAO,CAAC,EAAE,CAAC;gBAC7B,MAAM,YAAY,GAAG,aAAa,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC;gBAC5F,IAAI,YAAY,KAAK,CAAC,CAAC;oBAAE,OAAO;gBAEhC,IAAI,iBAAiB,GAAG,OAAO,CAAC;gBAChC,MAAM,mBAAmB,GAAG,WAAW,CAAC,GAAG,CAAC,qBAAqB,CAAC,CAAC;gBACnE,IACE,mBAAmB,CAAC,OAAO;oBAC3B,YAAY,CAAC,QAAQ,KAAK,mBAAmB,CAAC,eAAe;oBAC7D,CAAC,mBAAmB,CAAC,iBAAiB,CAAC,QAAQ,CAAC,YAAY,CAAC,QAAQ,CAAC,EACtE,CAAC;oBACD,IAAI,OAAO,CAAC,IAAI,EAAE,CAAC;wBACjB,MAAM,kBAAkB,GAAG,MAAM,qBAAqB,CAAC;4BACrD,OAAO,EAAE,MAAM;4BACf,WAAW,EAAE,CAAC,SAAS,CAAC;yBACzB,CAAC,CAAC;wBAEH,iBAAiB,GAAG;4BAClB,GAAG,OAAO;4BACV,cAAc,EAAE,kBAAkB,EAAE,IAAI,IAAI,OAAO,CAAC,cAAc;yBACnE,CAAC;oBACJ,CAAC;yBAAM,CAAC;wBACN,iBAAiB,GAAG,OAAO,CAAC;oBAC9B,CAAC;gBACH,CAAC;gBAED,yBAAyB,CAAC,EAAE,cAAc,EAAE,CAAC,iBAAiB,CAAC,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC,CAAC;gBAEvF,0BAA0B;gBAC1B,YAAY;gBACZ,mBAAmB;gBACnB,kCAAkC;gBAClC,2CAA2C;gBAC3C,OAAO;gBACP,MAAM;gBACN,IAAI,CAAC,mBAAmB,CAAC,MAAM,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;gBACvD,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,CAAC;YAAC,OAAO,KAAc,EAAE,CAAC;gBACxB,WAAW,CAAC,KAAK,EAAE,uCAAuC,CAAC,CAAC;YAC9D,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,QAAkB,EAAE,EAAE;YACvC,IAAI,CAAC;gBACH,IAAI,QAAQ,EAAE,CAAC;oBACb,MAAM,MAAM,GAAG,QAAQ,CAAC,EAAE,CAAC;oBAE3B,qBAAqB,CAAC;wBACpB,MAAM;wBACN,WAAW,EAAE;4BACX,YAAY,EAAE,CAAC;4BACf,UAAU,EAAE,QAAQ,CAAC,OAAO;yBAC7B;qBACF,CAAC,CAAC;oBAEH,MAAM,KAAK,GAAG,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;oBACzC,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC;oBAC9D,IAAI,SAAS,KAAK,CAAC,CAAC,EAAE,CAAC;wBACrB,KAAK,CAAC,SAAS,CAAC,GAAG,QAAQ,CAAC;oBAC9B,CAAC;yBAAM,CAAC;wBACN,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;oBACvB,CAAC;oBAED,aAAa,CAAC,GAAG,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;oBAClC,oBAAoB,EAAE,CAAC;gBACzB,CAAC;YACH,CAAC;YAAC,OAAO,KAAc,EAAE,CAAC;gBACxB,WAAW,CAAC,KAAK,EAAE,sCAAsC,CAAC,CAAC;YAC7D,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,wDAAwD;QACxD,uEAAuE;QACvE,gFAAgF;QAChF,MAAM;IACR,CAAC;IAEO,uBAAuB,GAAG,GAAG,EAAE;QACrC,aAAa,CAAC,KAAK,EAAE,CAAC;QACtB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;QAC7B,2BAA2B;QAC3B,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC;QAClC,IAAI,CAAC,oBAAoB,GAAG,CAAC,CAAC;QAC9B,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;QAC3B,IAAI,CAAC,YAAY,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC;IAC3C,CAAC,CAAA;IAED,KAAK,CAAC,iBAAiB;QACrB,IAAI,CAAC,eAAe,GAAG,iBAAiB,CAAC,QAAQ,CAAC,cAAc,EAAE,KAAK,EAAC,OAAO,EAAC,EAAE;YAChF,IAAI,CAAC,OAAO,EAAE,CAAC;gBACb,IAAI,CAAC,uBAAuB,EAAE,CAAC;gBAC/B,OAAO;YACT,CAAC;YAED,MAAM,SAAS,GAAG,OAAO,CAAC,EAAE,CAAC;YAE7B,IAAI,OAAO,CAAC,EAAE,KAAK,IAAI,CAAC,gBAAgB,EAAE,EAAE,EAAE,CAAC;gBAC7C,wEAAwE;gBACxE,IAAI,CAAC,uBAAuB,EAAE,CAAC;gBAE/B,iBAAiB,CAAC,GAAG,CAAC,kBAAkB,EAAE,KAAK,CAAC,CAAC;gBACjD,iBAAiB,CAAC,GAAG,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC;gBAE7C,8CAA8C;gBAC9C,IAAI,IAAI,CAAC,eAAe;oBAAE,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;gBACrE,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;gBAC3B,IAAI,CAAC,oBAAoB,GAAG,KAAK,CAAC;gBAElC,mCAAmC;gBACnC,iHAAiH;gBACjH,IAAI;gBAEJ,MAAM,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;gBAE5B,gGAAgG;gBAChG,MAAM,QAAQ,GAAG,aAAa,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;gBAC/C,MAAM,KAAK,GAAG,QAAQ,CAAC,MAAM,CAAC;gBAC9B,IAAI,IAAI,CAAC,wBAAwB,IAAI,KAAK,GAAG,IAAI,CAAC,wBAAwB,EAAE,CAAC;oBAC3E,MAAM,KAAK,GAAG,EAAE,CAAC,CAAC,6FAA6F;oBAC/G,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC,CAAC;oBACzC,IAAI,CAAC,YAAY,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC;gBAC5C,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,YAAY,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,CAAC,EAAE,CAAC;gBAC7D,CAAC;gBAED,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC;gBAChC,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;gBAE3B,MAAM,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC;gBAE3D,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;gBACtB,IAAI,CAAC,cAAc,EAAE,CAAC;gBAEtB,IAAI,CAAC,kBAAkB,EAAE,CAAC;YAC5B,CAAC;YAED,gCAAgC;YAChC,kCAAkC;YAClC,MAAM,kBAAkB,CAAC,SAAS,CAAC,CAAC;YACpC,IAAI;QACN,CAAC,CAAC,CAAC;IACL,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,eAAe,EAAE,EAAE,CAAC;QACzB,IAAI,IAAI,CAAC,eAAe;YAAE,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACrE,MAAM,YAAY,GAAG,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;QAC3D,IAAI,YAAY,EAAE,CAAC;YACjB,SAAS,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;QAC7B,CAAC;IACH,CAAC;IAEO,4BAA4B;QAClC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,UAAU;YAAE,OAAO;QAC7C,MAAM,GAAG,GAAG,IAAI,IAAI,EAAE,CAAC;QACvB,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;QAC3D,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,EAAE,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;QAEnD,IAAI,MAAM,IAAI,CAAC,EAAE,CAAC;YAChB,IAAI,IAAI,CAAC,eAAe;gBAAE,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;YACrE,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC,qBAAqB;YACjD,IAAI,CAAC,oBAAoB,GAAG,KAAK,CAAC;YAClC,OAAO;QACT,CAAC;QAED,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;QAC/C,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,EAAE,CAAC,CAAC;QAC9C,MAAM,OAAO,GAAG,YAAY,GAAG,EAAE,CAAC;QAClC,MAAM,UAAU,GAAG,OAAO,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QACvD,MAAM,UAAU,GAAG,OAAO,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QACvD,MAAM,SAAS,GAAG,GAAG,UAAU,IAAI,UAAU,EAAE,CAAC;QAChD,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,IAAI,CAAC,cAAc,CAAC,WAAW,GAAG,SAAS,CAAC;QAC9C,CAAC;IACH,CAAC;IAEO,oBAAoB;QAC1B,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE,OAAO;QACjC,IAAI,IAAI,CAAC,eAAe;YAAE,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACrE,IAAI,CAAC,oBAAoB,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QACjE,yCAAyC;QACzC,qBAAqB,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,CAAC,CAAC;QACjE,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC,WAAW,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,EAAE,IAAI,CAAC,CAAC;IAC7F,CAAC;IAEO,KAAK,CAAC,YAAY,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,GAAG,KAAK,EAAgF;QACtJ,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,eAAe;YAAE,OAAO;QAEtD,IAAI,CAAC;YACH,IAAI,IAAI,EAAE,CAAC;gBACT,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;YAC9B,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YAC3B,CAAC;YAED,MAAM,qBAAqB,CAAC;gBAC1B,cAAc;gBACd,IAAI;gBACJ,IAAI;gBACJ,OAAO;aACR,CAAC,CAAC;QACL,CAAC;QAAC,OAAO,KAAc,EAAE,CAAC;YACxB,WAAW,CAAC,KAAK,EAAE,8BAA8B,CAAC,CAAC;QACrD,CAAC;gBAAS,CAAC;YACT,IAAI,IAAI,EAAE,CAAC;gBACT,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;YAC/B,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;YAC5B,CAAC;QACH,CAAC;IACH,CAAC;IAEO,YAAY,GAAG,KAAK,IAAI,EAAE;QAChC,MAAM,OAAO,GAAG,IAAI,CAAC,eAAe,CAAC;QACrC,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,MAAM,SAAS,GAAG,GAAG,CAAC;QACtB,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,YAAY,EAAE,GAAG,OAAO,CAAC;QAE1D,6CAA6C;QAC7C,MAAM,aAAa,GAAG,aAAa,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC;QAC3D,IAAI,CAAC,kBAAkB,CAAC,SAAS,EAAE,YAAY,EAAE,aAAa,CAAC,CAAC;QAEhE,yBAAyB;QACzB,IAAI,SAAS,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;YACnC,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC;QAChC,CAAC;aAAM,IAAI,SAAS,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;YAC1C,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;QAC9B,CAAC;QACD,IAAI,CAAC,aAAa,GAAG,SAAS,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QAEpD,cAAc;QACd,IAAI,CAAC,UAAU,GAAG,SAAS,GAAG,YAAY,IAAI,YAAY,CAAC;QAC3D,IAAI,IAAI,CAAC,UAAU;YAAE,OAAO;QAE5B,MAAM,aAAa,GAAG,aAAa,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;QAEzD,iDAAiD;QACjD,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,EAAE,CAAC;YAClC,MAAM,YAAY,GAAG,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC;YACtD,MAAM,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;YACxC,IAAI,SAAS,IAAI,YAAY,IAAI,CAAC,aAAa,EAAE,CAAC;gBAChD,MAAM,IAAI,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC,CAAC;gBAChD,OAAO;YACT,CAAC;QACH,CAAC;QAED,sDAAsD;QACtD,IAAI,IAAI,CAAC,eAAe,KAAK,MAAM,EAAE,CAAC;YACpC,MAAM,OAAO,GAAG,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC;YACjD,MAAM,YAAY,GAAG,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC;YACtD,MAAM,YAAY,GAAG,SAAS,GAAG,YAAY,GAAG,YAAY,GAAG,SAAS,CAAC;YACzE,IAAI,YAAY,IAAI,CAAC,OAAO,IAAI,YAAY,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;gBAChE,MAAM,IAAI,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,OAAO,IAAI,YAAY,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;gBAC1E,OAAO;YACT,CAAC;QACH,CAAC;IACH,CAAC,CAAC;IAEF,MAAM;QACJ,MAAM,CAAC,GAAG,cAAc,EAAE,CAAC;QAC3B,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;QACvC,MAAM,QAAQ,GAAG,aAAa,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;QAC/C,MAAM,YAAY,GAAG,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;QAC3D,MAAM,cAAc,GAAG,WAAW,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;QACzD,iEAAiE;QACjE,MAAM,aAAa,GAAG,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;QAExD,uFAAuF;QACvF,MAAM,mBAAmB,GAAG,IAAI,CAAC,wBAAwB,IAAI,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC,wBAAwB,CAAC;QAC7G,MAAM,oBAAoB,GAAG,mBAAmB,CAAC,CAAC,CAAC,IAAI,CAAC,yBAAyB,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC;QAEjH,MAAM,gBAAgB,GAAG,IAAI,CAAC,oBAAoB,CAAC;QAEnD,mEAAmE;QACnE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,YAAY,CAAC;QACzC,MAAM,eAAe,GAAG,mBAAmB,CAAC,CAAC,CAAC,KAAK,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,CAAC;QACrF,MAAM,kBAAkB,GAAG,mBAAmB,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,GAAG,GAAG,CAAC,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAEvH,OAAO,CACL,EAAC,IAAI,mEAAa,KAAK,IACpB,YAAY,KAAK,IAAI,CAAC,CAAC,CAAC,CACvB,WAAK,KAAK,EAAC,kCAAkC;YAC3C,WAAK,KAAK,EAAC,kCAAkC;gBAC3C,WAAK,KAAK,EAAC,SAAS;oBAClB,EAAC,IAAI,IAAC,IAAI,EAAC,mBAAmB,EAAC,QAAQ,EAAC,SAAS,GAAG,CAChD;gBACL,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,+BAA+B,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,sCAAsC,CAAC;gBAC/F,cAAc,IAAI,EAAC,OAAO,IAAC,SAAS,EAAE,EAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,EAAE,KAAK,EAAE,CAAC,CAAC,yBAAyB,CAAC,EAAE,EAAE,EAAC,iBAAiB,GAAG,CACrH,CACF,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,kCAAkC;YAC3C,sBAAe;YACd,CAAC,iBAAiB,CAAC,GAAG,CAAC,kBAAkB,CAAC,IAAI,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,IAAI,CACvF,WAAK,KAAK,EAAC,6BAA6B;gBACrC,iBAAiB,CAAC,GAAG,CAAC,kBAAkB,CAAC,IAAI,oBAAc,MAAM,EAAC,SAAS,EAAC,KAAK,EAAE,CAAC,CAAC,0BAA0B,CAAC,GAAI;gBACpH,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,IAAI,oBAAc,MAAM,EAAC,SAAS,EAAC,KAAK,EAAE,CAAC,CAAC,sBAAsB,CAAC,GAAI,CACzG,CACP;YACD,WACE,KAAK,EAAE,0CAA0C,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAAK,EAAE,EAC9F,EAAE,EAAE,eAAe,YAAY,CAAC,EAAE,EAAE,EACpC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC,EACtC,QAAQ,EAAE,IAAI,CAAC,YAAY;gBAE1B,IAAI,CAAC,YAAY,IAAI,CACpB,WAAK,EAAE,EAAC,aAAa,EAAC,KAAK,EAAC,2BAA2B;oBACrD,EAAC,IAAI,IAAC,IAAI,EAAC,cAAc,EAAC,QAAQ,EAAC,0BAA0B,GAAG,CAC5D,CACP;gBAEA,eAAe,GAAG,CAAC,IAAI,WAAK,KAAK,EAAE,EAAE,MAAM,EAAE,GAAG,eAAe,IAAI,EAAE,GAAI;gBAGzE,MAAM,CAAC,OAAO,CAAC,oBAAoB,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC;oBAC3D,WAAK,GAAG,EAAE,QAAQ,IAAI,EAAE,EAAE,KAAK,EAAC,0BAA0B;wBACxD,YAAM,KAAK,EAAC,gCAAgC,IACzC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CAC3D,CACH;oBACN,GAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACnB,oBAAc,GAAG,EAAE,IAAI,CAAC,EAAE,EAAE,IAAI,EAAE,IAAI,GAAI,CAC3C,CAAC;iBACH,CAAC;gBAGD,kBAAkB,GAAG,CAAC,IAAI,WAAK,KAAK,EAAE,EAAE,MAAM,EAAE,GAAG,kBAAkB,IAAI,EAAE,GAAI;gBAE/E,IAAI,CAAC,eAAe,IAAI,CACvB,WAAK,EAAE,EAAC,gBAAgB,EAAC,KAAK,EAAC,2BAA2B;oBACxD,EAAC,IAAI,IAAC,IAAI,EAAC,cAAc,EAAC,QAAQ,EAAC,0BAA0B,GAAG,CAC5D,CACP,CACG;YACN,WAAK,KAAK,EAAC,UAAU;gBAClB,CAAC,IAAI,CAAC,UAAU,IAAI,CACnB,WAAK,KAAK,EAAE,gCAAgC,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE;oBACpF,EAAC,WAAW,IAAC,QAAQ,EAAC,WAAW,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,GAAI,CAC1E,CACP;gBACA,gBAAgB;oBACf,CAAC,GAAG,EAAE;wBACJ,MAAM,QAAQ,GAAG,CAAC,CAAC,2BAA2B,CAAC,CAAC;wBAChD,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,CAAC,cAAc,EAAE,KAAK,IAAI,CAAC,CAAC,CAAC;wBACzD,MAAM,aAAa,GAAG,QAAQ,CAAC,OAAO,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;wBAC5D,MAAM,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;wBACjD,MAAM,MAAM,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;wBAC9B,MAAM,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;wBAC7B,OAAO,CACL,WACE,KAAK,EAAC,2BAA2B,EACjC,KAAK,EAAE,EAAE,MAAM,EAAE,kBAAkB,EAAE;4BAErC,gBAAO,MAAM,CAAQ;4BACrB,YACE,GAAG,EAAE,EAAE,CAAC,EAAE;oCACR,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;oCACzB,IAAI,CAAC,4BAA4B,EAAE,CAAC;gCACtC,CAAC,EACD,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,GAClE;4BACR,gBAAO,KAAK,CAAQ,CAChB,CACP,CAAC;oBACJ,CAAC,CAAC,EAAE;gBACN,qBAAc,CACV,CACF,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, State, h, Event, EventEmitter, Element, Listen } from '@stencil/core';\nimport { chatsStore, configStore, messagesStore, selectedChatStore } from '../../store/store';\nimport { useTranslation } from '../../utils/utils';\nimport { Icon } from '../internal-component/icon';\nimport { initSocket, joinRoom, leaveRoom } from '../../utils/socket';\nimport { ChannelType, ChatMessageItem, ChatRead, TChatItem } from '../../store/type';\nimport {\n getOrFetchTranslation,\n handleGetChatMessages,\n handleMapReadMessage,\n serviceReadMessage,\n initDB,\n serviceUpdateChatItem,\n serviceUpdateMessageItems,\n} from '../../store/message';\nimport { getReplyTokenInfo } from '../../api';\nimport { GetReplyTokenInfoResponse } from '../../api/type';\nimport groupBy from 'lodash/groupBy';\nimport { displayLongDate } from '../../utils/dayjs';\nimport { ZButton } from '../internal-component/z-button';\nimport dayjs from 'dayjs';\nimport { ZIconButton } from '../internal-component/z-icon-button';\nimport { handleError } from '../../store/dialog';\n\n@Component({\n tag: 'message-box',\n styleUrl: 'message-box.css',\n})\nexport class MessageBox {\n @Element() hostElement!: HTMLElement;\n\n private disposeListener: () => void;\n private replyTokenTimer?: number;\n\n @Event({ bubbles: true, composed: true }) focusRequested!: EventEmitter;\n\n @Listen('click')\n handleClick() {\n this.handleReadMessage();\n }\n\n @State() isInitial = false;\n @State() isLoadingTop = false;\n @State() isLoadingBottom = false;\n @State() isAtBottom: boolean = true;\n @State() replyTokenInfo: GetReplyTokenInfoResponse \| null = null;\n @State() showReplyTokenBanner: boolean = false;\n private scrollContainer?: HTMLDivElement;\n private prevSelectedChat: TChatItem \| null = null;\n private replyTokenSpan?: HTMLSpanElement;\n private lastScrollTop: number = 0;\n private scrollDirection: 'up' \| 'down' \| null = null;\n\n // Memoization cache for grouped messages\n private cachedGroupedMessages: Record<string, ChatMessageItem[]> \| null = null;\n private cachedMessagesLength: number = 0;\n private cachedMessageIds: string = '';\n\n // Enable virtual scrolling to reduce DOM nodes for large message lists\n private readonly ENABLE_VIRTUAL_SCROLLING = true;\n @State() private visibleRange: { start: number; end: number } = { start: 0, end: 0 };\n private readonly BUFFER_SIZE = 3; // Extra items to render above/below viewport (reduced from 5 for optimal performance)\n private readonly ESTIMATED_ITEM_HEIGHT = 72; // Average message height in pixels\n private readonly VIRTUAL_SCROLL_THRESHOLD = 30; // Only use virtual scrolling when > 30 messages (reduced from 150 for better performance)\n\n /*\n Calculate which messages should be visible based on scroll position\n * Virtual scrolling: Only render messages in viewport + buffer\n /\n private updateVisibleRange(scrollTop: number, clientHeight: number, totalMessages: number) {\n const viewportStart = Math.floor(scrollTop / this.ESTIMATED_ITEM_HEIGHT);\n const viewportEnd = Math.ceil((scrollTop + clientHeight) / this.ESTIMATED_ITEM_HEIGHT);\n\n const start = Math.max(0, viewportStart - this.BUFFER_SIZE);\n const end = Math.min(totalMessages, viewportEnd + this.BUFFER_SIZE);\n\n // Only update if range changed significantly (avoid unnecessary re-renders)\n if (Math.abs(this.visibleRange.start - start) > 5 \|\| Math.abs(this.visibleRange.end - end) > 5) {\n this.visibleRange = { start, end };\n }\n }\n\n /\n Get only visible messages from grouped messages\n * Reduces DOM nodes by only rendering what's in viewport\n /\n private getVisibleGroupedMessages(groupedByDate: Record<string, ChatMessageItem[]>): Record<string, ChatMessageItem[]> {\n const { start, end } = this.visibleRange;\n // eslint-disable-next-line no-unused-vars\n const allMessages = Object.entries(groupedByDate).flatMap(([_, items]) => items);\n const visibleMessages = allMessages.slice(start, end);\n\n // Re-group visible messages by date\n const visibleGrouped: Record<string, ChatMessageItem[]> = {};\n for (const message of visibleMessages) {\n const date = displayLongDate(message.message_at);\n if (!visibleGrouped[date]) {\n visibleGrouped[date] = [];\n }\n visibleGrouped[date].push(message);\n }\n\n return visibleGrouped;\n }\n\n /\n Memoized message grouping - only recalculates when messages actually change\n * Performance: Reduces 60fps operations to ~1-5 per second (when messages update)\n /\n private getGroupedMessages(messages: ChatMessageItem[]): Record<string, ChatMessageItem[]> {\n // Quick check: If length hasn't changed and IDs match, return cached\n const messageIds = messages.map(m => m.id).join(',');\n\n if (this.cachedGroupedMessages && messages.length === this.cachedMessagesLength && messageIds === this.cachedMessageIds) {\n return this.cachedGroupedMessages;\n }\n\n // Recalculate: Sort and group messages\n const sorted = [...messages].sort((a, b) => (dayjs(a.message_at).isBefore(dayjs(b.message_at)) ? -1 : 1));\n\n const grouped = groupBy(sorted, item => displayLongDate(item.message_at));\n\n // Update cache\n this.cachedGroupedMessages = grouped;\n this.cachedMessagesLength = messages.length;\n this.cachedMessageIds = messageIds;\n\n return grouped;\n }\n\n componentDidLoad() {\n initDB();\n this.scrollToBottom();\n }\n\n private handleReadMessage = async () => {\n const selectedChat = selectedChatStore.get('selectedChat');\n if (!selectedChat) return;\n const matchChat = chatsStore.get('chats').find(item => item.id === selectedChat?.id);\n if (!matchChat) return;\n if (matchChat.unread_count > 0) {\n await serviceReadMessage(selectedChat.id);\n }\n };\n\n private scrollToBottom(isSmooth?: boolean) {\n if (this.scrollContainer) {\n setTimeout(() => {\n this.scrollContainer.scrollTo({\n top: this.scrollContainer.scrollHeight,\n behavior: isSmooth ? 'smooth' : 'instant',\n });\n }, 100);\n }\n }\n\n private async fetchReplyTokenInfo(sessionId: string, channel: ChannelType) {\n if (channel !== 'line') return;\n try {\n const info = await getReplyTokenInfo({ sessionId });\n this.replyTokenInfo = info;\n this.startReplyTokenTimer();\n } catch (error: unknown) {\n handleError(error, 'Failed to get reply token info');\n }\n }\n\n // private async handleSetChatLanguage(sessionId: string, newChat: TChatItem, newLanguage: string) {\n // const language = newLanguage;\n // const { code } = await updateChat({ sessionId, language })\n // if (code === 'chat-updated') {\n // const readChats = chatsStore.get('chats').map((chat) => {\n // if (chat.id === sessionId) {\n // return { ...chat, language };\n // }\n // return chat;\n // })\n\n // chatsStore.set('chats', readChats);\n // selectedChatStore.set('selectedChat', { ...newChat, language });\n // }\n // }\n\n private handleSocketEvents() {\n const socket = initSocket();\n const selectedChat = selectedChatStore.get('selectedChat');\n const chatId = selectedChat.id;\n joinRoom(chatId);\n\n socket.on('message', async (message: ChatMessageItem) => {\n try {\n const messageId = message.id;\n const existChatIdx = messagesStore.get('messages').findIndex(item => item.id === messageId);\n if (existChatIdx !== -1) return;\n\n let translatedMessage = message;\n const translationSettings = configStore.get('translationSettings');\n if (\n translationSettings.is_auto &&\n selectedChat.language !== translationSettings.target_language &&\n !translationSettings.exclude_languages.includes(selectedChat.language)\n ) {\n if (message.text) {\n const translatedResponse = await getOrFetchTranslation({\n chat_id: chatId,\n message_ids: [messageId],\n });\n\n translatedMessage = {\n ...message,\n translatedText: translatedResponse?.text \|\| message.translatedText,\n };\n } else {\n translatedMessage = message;\n }\n }\n\n serviceUpdateMessageItems({ updateMessages: [translatedMessage], clearSending: true });\n\n // serviceUpdateChatItem({\n // chatId,\n // updateValue: {\n // last_message: message.text,\n // last_message_at: message.message_at,\n // },\n // });\n this.fetchReplyTokenInfo(chatId, selectedChat.channel);\n this.scrollToBottom();\n } catch (error: unknown) {\n handleError(error, 'Failed to process message from socket');\n }\n });\n\n socket.on('read', (chatRead: ChatRead) => {\n try {\n if (chatRead) {\n const chatId = chatRead.id;\n\n serviceUpdateChatItem({\n chatId,\n updateValue: {\n unread_count: 0,\n updated_at: chatRead.read_at,\n },\n });\n\n const reads = messagesStore.get('reads');\n const readIndex = reads.findIndex(item => item.id === chatId);\n if (readIndex !== -1) {\n reads[readIndex] = chatRead;\n } else {\n reads.push(chatRead);\n }\n\n messagesStore.set('reads', reads);\n handleMapReadMessage();\n }\n } catch (error: unknown) {\n handleError(error, 'Failed to process read message event');\n }\n });\n\n // Deprecate backend will check and update automatically\n // socket.on('language', (detectedLanguage: { language?: string }) => {\n // this.handleSetChatLanguage(chatId, selectedChat, detectedLanguage.language)\n // });\n }\n\n private handleResetMessageCache = () => {\n messagesStore.reset();\n this.prevSelectedChat = null;\n // Clear render immediately\n this.cachedGroupedMessages = null;\n this.cachedMessagesLength = 0;\n this.cachedMessageIds = '';\n this.visibleRange = { start: 0, end: 0 };\n }\n\n async componentWillLoad() {\n this.disposeListener = selectedChatStore.onChange('selectedChat', async newChat => {\n if (!newChat) {\n this.handleResetMessageCache();\n return;\n }\n\n const sessionId = newChat.id;\n\n if (newChat.id !== this.prevSelectedChat?.id) {\n // IMPORTANT: Clear everything FIRST to remove old DOM nodes immediately\n this.handleResetMessageCache();\n\n selectedChatStore.set('isSyncingMessage', false);\n selectedChatStore.set('isSyncingTag', false);\n\n // reset reply token info when switching chats\n if (this.replyTokenTimer) window.clearInterval(this.replyTokenTimer);\n this.replyTokenInfo = null;\n this.showReplyTokenBanner = false;\n\n // if (newChat.language === null) {\n // await this.handleSetChatLanguage(sessionId, newChat, configStore.get('translationSettings').target_language)\n // }\n\n await this.loadMessages({});\n\n // After messages loaded, clamp visibleRange to the most recent chunk when using virtual scroll.\n const messages = messagesStore.get('messages');\n const total = messages.length;\n if (this.ENABLE_VIRTUAL_SCROLLING && total > this.VIRTUAL_SCROLL_THRESHOLD) {\n const CHUNK = 50; // number of recent messages to render initially (reduced from 200 for faster initial render)\n const start = Math.max(0, total - CHUNK);\n this.visibleRange = { start, end: total };\n } else {\n this.visibleRange = { start: 0, end: Math.max(50, total) };\n }\n\n this.prevSelectedChat = newChat;\n this.focusRequested.emit();\n\n await this.fetchReplyTokenInfo(sessionId, newChat.channel);\n\n this.isInitial = true;\n this.scrollToBottom();\n\n this.handleSocketEvents();\n }\n\n //Always read message when click\n // if (newChat.unread_count > 0) {\n await serviceReadMessage(sessionId);\n // }\n });\n }\n\n disconnectedCallback() {\n this.disposeListener?.();\n if (this.replyTokenTimer) window.clearInterval(this.replyTokenTimer);\n const selectedChat = selectedChatStore.get('selectedChat');\n if (selectedChat) {\n leaveRoom(selectedChat.id);\n }\n }\n\n private updateReplyTokenRemainingDOM() {\n if (!this.replyTokenInfo?.expired_at) return;\n const now = new Date();\n const expiredAt = new Date(this.replyTokenInfo.expired_at);\n const diffMs = expiredAt.getTime() - now.getTime();\n\n if (diffMs <= 0) {\n if (this.replyTokenTimer) window.clearInterval(this.replyTokenTimer);\n this.replyTokenInfo = null; // reset when expired\n this.showReplyTokenBanner = false;\n return;\n }\n\n const totalSeconds = Math.floor(diffMs / 1000);\n const minutes = Math.floor(totalSeconds / 60);\n const seconds = totalSeconds % 60;\n const minutesStr = minutes.toString().padStart(2, '0');\n const secondsStr = seconds.toString().padStart(2, '0');\n const remaining = `${minutesStr}:${secondsStr}`;\n if (this.replyTokenSpan) {\n this.replyTokenSpan.textContent = remaining;\n }\n }\n\n private startReplyTokenTimer() {\n if (!this.replyTokenInfo) return;\n if (this.replyTokenTimer) window.clearInterval(this.replyTokenTimer);\n this.showReplyTokenBanner = (this.replyTokenInfo.total \|\| 0) > 0;\n // prime the DOM value once and then tick\n requestAnimationFrame(() => this.updateReplyTokenRemainingDOM());\n this.replyTokenTimer = window.setInterval(() => this.updateReplyTokenRemainingDOM(), 1000);\n }\n\n private async loadMessages({ startMessageId, next, prev, isNewer = false }: { startMessageId?: string; next?: string; prev?: string; isNewer?: boolean }) {\n if (this.isLoadingTop \|\| this.isLoadingBottom) return;\n\n try {\n if (prev) {\n this.isLoadingBottom = true;\n } else {\n this.isLoadingTop = true;\n }\n\n await handleGetChatMessages({\n startMessageId,\n next,\n prev,\n isNewer,\n });\n } catch (error: unknown) {\n handleError(error, 'Failed to load chat messages');\n } finally {\n if (prev) {\n this.isLoadingBottom = false;\n } else {\n this.isLoadingTop = false;\n }\n }\n }\n\n private handleScroll = async () => {\n const element = this.scrollContainer;\n if (!element) return;\n\n const threshold = 100;\n const { scrollTop, scrollHeight, clientHeight } = element;\n\n // Update visible range for virtual scrolling\n const totalMessages = messagesStore.get('messages').length;\n this.updateVisibleRange(scrollTop, clientHeight, totalMessages);\n\n //Detect scroll direction\n if (scrollTop > this.lastScrollTop) {\n this.scrollDirection = 'down';\n } else if (scrollTop < this.lastScrollTop) {\n this.scrollDirection = 'up';\n }\n this.lastScrollTop = scrollTop <= 0 ? 0 : scrollTop;\n\n //Check bottom\n this.isAtBottom = scrollTop + clientHeight >= scrollHeight;\n if (this.isAtBottom) return;\n\n const jumpMessageId = messagesStore.get('jumpMessageId');\n\n //Is Scroll up and Near top → Load older messages\n if (this.scrollDirection === 'up') {\n const olderNextKey = messagesStore.get('older')?.next;\n const isNearTop = scrollTop < threshold;\n if (isNearTop && olderNextKey && !jumpMessageId) {\n await this.loadMessages({ next: olderNextKey });\n return;\n }\n }\n\n //Is Scroll down and Near bottom → Load newer messages\n if (this.scrollDirection === 'down') {\n const prevKey = messagesStore.get('newer')?.prev;\n const olderPrevKey = messagesStore.get('older')?.prev;\n const isNearBottom = scrollTop + clientHeight > scrollHeight - threshold;\n if (isNearBottom && (prevKey \|\| olderPrevKey) && !jumpMessageId) {\n await this.loadMessages({ prev: prevKey \|\| olderPrevKey, isNewer: true });\n return;\n }\n }\n };\n\n render() {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const messages = messagesStore.get('messages');\n const selectedChat = selectedChatStore.get('selectedChat');\n const isNotConnected = configStore.get('isNotConnected');\n // Use memoized grouping - only recalculates when messages change\n const groupedByDate = this.getGroupedMessages(messages);\n\n // Virtual scrolling - only enabled if flag is true and message count exceeds threshold\n const useVirtualScrolling = this.ENABLE_VIRTUAL_SCROLLING && messages.length > this.VIRTUAL_SCROLL_THRESHOLD;\n const visibleGroupedByDate = useVirtualScrolling ? this.getVisibleGroupedMessages(groupedByDate) : groupedByDate;\n\n const isReplyTokenInfo = this.showReplyTokenBanner;\n\n // Calculate spacer heights for virtual scrolling (only if enabled)\n const { start, end } = this.visibleRange;\n const topSpacerHeight = useVirtualScrolling ? start this.ESTIMATED_ITEM_HEIGHT : 0;\n const bottomSpacerHeight = useVirtualScrolling ? Math.max(0, (messages.length - end) * this.ESTIMATED_ITEM_HEIGHT) : 0;\n\n return (\n <Host data-theme={theme}>\n {selectedChat === null ? (\n <div class=\"message-box-wrapper z-max-height\">\n <div class=\"message-box-no-selected-chat-box\">\n <div class=\"mx-auto\">\n <Icon name=\"MessageSquareText\" addClass=\"size-18\" />\n </div>\n {isNotConnected ? t('chat_tab.you_not_connect_chat') : t('chat_tab.please_choose_chat_to_reply')}\n {isNotConnected && <ZButton startIcon={<Icon name=\"Plus\" />} label={t('chat_tab.add_connection')} id=\"connect-channel\" />}\n </div>\n </div>\n ) : (\n <div class=\"message-box-wrapper z-max-height\">\n <chat-header />\n {(selectedChatStore.get('isSyncingMessage') \|\| selectedChatStore.get('isSyncingTag')) && (\n <div class=\"message-box-syncing-message\">\n {selectedChatStore.get('isSyncingMessage') && <status-badge status=\"loading\" label={t('chat_tab.syncing_message')} />}\n {selectedChatStore.get('isSyncingTag') && <status-badge status=\"loading\" label={t('chat_tab.syncing_tag')} />}\n </div>\n )}\n <div\n class={`message-box-container scroll-container ${isReplyTokenInfo ? 'pb-8 pt-4 px-4' : 'p-4'}`}\n id={`message-box-${selectedChat.id}`}\n ref={el => (this.scrollContainer = el)}\n onScroll={this.handleScroll}\n >\n {this.isLoadingTop && (\n <div id=\"loading-top\" class=\"message-box-loading mb-10\">\n <Icon name=\"LoaderCircle\" addClass=\"message-box-loading-icon\" />\n </div>\n )}\n {/* Top spacer for virtual scrolling /}\n {topSpacerHeight > 0 && <div style={{ height: `${topSpacerHeight}px` }} />}\n\n {/ Render only visible messages /}\n {Object.entries(visibleGroupedByDate).map(([date, items]) => [\n <div key={`time-${date}`} class=\"message-box-time-wrapper\">\n <span class=\"message-box-time bg-time-badge\">\n {dayjs().tz().format('DD MMM YYYY') === date ? t('today') : date}\n </span>\n </div>,\n ...items.map(item => (\n <message-item key={item.id} item={item} />\n ))\n ])}\n\n {/ Bottom spacer for virtual scrolling */}\n {bottomSpacerHeight > 0 && <div style={{ height: `${bottomSpacerHeight}px` }} />}\n\n {this.isLoadingBottom && (\n <div id=\"loading-bottom\" class=\"message-box-loading mt-10\">\n <Icon name=\"LoaderCircle\" addClass=\"message-box-loading-icon\" />\n </div>\n )}\n </div>\n <div class=\"relative\">\n {!this.isAtBottom && (\n <div class={`message-box-scroll-to-bottom ${isReplyTokenInfo ? '-top-24' : '-top-12'}`}>\n <ZIconButton iconName=\"ArrowDown\" onClick={() => this.scrollToBottom(true)} />\n </div>\n )}\n {isReplyTokenInfo &&\n (() => {\n const template = t('chat_tab.reply_token_info');\n const totalStr = String(this.replyTokenInfo?.total ?? 0);\n const replacedTotal = template.replace('{total}', totalStr);\n const parts = replacedTotal.split('{remaining}');\n const before = parts[0] \|\| '';\n const after = parts[1] \|\| '';\n return (\n <div\n class=\"message-box-token-wrapper\"\n style={{ bottom: 'calc(100% + 8px)' }}\n >\n <span>{before}</span>\n <span\n ref={el => {\n this.replyTokenSpan = el;\n this.updateReplyTokenRemainingDOM();\n }}\n style={{ minWidth: '4ch', display: 'inline-block', textAlign: 'center' }}\n ></span>\n <span>{after}</span>\n </div>\n );\n })()}\n <chat-input />\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"]}