/* Clear capsule material is opt-in, independently of the iMessage chat skin. */
html[data-bubble-style=liquid]{
 --liquid-ink:#172a31;--liquid-glow:#ffffff55;--liquid-fill:#ffffff16;
 --liquid-rim:#ffffffa8;
}
html[data-bubble-style=liquid][data-theme=dark]{
 --liquid-ink:#f4f8fc;--liquid-glow:#00000080;--liquid-fill:#1a2a3626;
 --liquid-rim:#effaff73;
}
html[data-bubble-style=liquid] body[data-page=chat] #messages .message .bubble:not(.voice-bubble):not(.photo-bubble){
 position:relative;isolation:isolate;inline-size:fit-content!important;width:fit-content!important;
 max-width:min(100%,78vw,560px)!important;min-width:0;min-height:40px;
 padding:10px 17px!important;margin-block:3px;
 border:1px solid transparent!important;border-radius:var(--liquid-radius,999px)!important;
 background:var(--liquid-fill)!important;color:var(--liquid-ink)!important;
 box-shadow:inset 0 1px 1px var(--liquid-rim)!important;
 -webkit-backdrop-filter:blur(1px) saturate(1.08)!important;backdrop-filter:blur(1px) saturate(1.08)!important;
 text-shadow:0 1px 3px var(--liquid-glow);line-height:1.45;overflow-wrap:anywhere;
}
html[data-bubble-style=liquid] body[data-page=chat] #messages .message .bubble:not(.voice-bubble):not(.photo-bubble)::before,
html[data-bubble-style=liquid] body[data-page=chat] #messages .message .bubble:not(.voice-bubble):not(.photo-bubble)::after{content:none!important;display:none!important}
html[data-bubble-style=liquid] body[data-page=chat] #messages .message .bubble[data-liquid-ready=true]:not(.voice-bubble):not(.photo-bubble){
 background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;
 box-shadow:none!important;
}
html[data-bubble-style=liquid][data-liquid-optics=true] body[data-page=chat] #bgLayer::after{content:none!important}
.liquid-background{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.liquid-optics{position:absolute;pointer-events:none;z-index:-1;border-radius:inherit}
.liquid-background[hidden],.liquid-optics[hidden]{display:none!important}
/* The existing dock and editor share the same clear, shadow-free material. */
html[data-bubble-style=liquid] body #tabBar,
html[data-bubble-style=liquid] body[data-page=chat] #composer{
 position:relative;isolation:isolate;
 border-color:transparent!important;background:var(--liquid-fill)!important;
 color:var(--liquid-ink)!important;box-shadow:inset 0 1px 1px var(--liquid-rim)!important;
 -webkit-backdrop-filter:blur(1px) saturate(1.08)!important;backdrop-filter:blur(1px) saturate(1.08)!important;
 text-shadow:0 1px 3px var(--liquid-glow);
}
html[data-bubble-style=liquid] body #tabBar{position:absolute}
html[data-bubble-style=liquid] body #tabBar[data-liquid-ready=true],
html[data-bubble-style=liquid] body[data-page=chat] #composer[data-liquid-ready=true]{
 background:transparent!important;box-shadow:none!important;
 -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
}
html[data-bubble-style=liquid] body #tabBar .tab{color:var(--liquid-ink)!important}
html[data-bubble-style=liquid] body #tabBar .tab[aria-current=page]{
 background:#ffffff38!important;box-shadow:inset 0 1px 0 var(--liquid-rim)!important;
}
html[data-bubble-style=liquid][data-theme=dark] body #tabBar .tab[aria-current=page]{background:#ffffff16!important}
html[data-bubble-style=liquid] body[data-page=chat] #composer :is(textarea,#addButton,#voiceButton,#stickerButton){color:var(--liquid-ink)!important}
html[data-bubble-style=liquid] body[data-page=chat] #composer textarea::placeholder{color:var(--liquid-ink);opacity:.65}
@media(forced-colors:active){
 html[data-bubble-style=liquid] body[data-page=chat] #messages .message .bubble:not(.voice-bubble):not(.photo-bubble){background:Canvas!important;color:CanvasText!important;border:1px solid CanvasText!important;text-shadow:none}
 html[data-bubble-style=liquid] body #tabBar,
 html[data-bubble-style=liquid] body[data-page=chat] #composer{background:Canvas!important;color:CanvasText!important;border-color:CanvasText!important;text-shadow:none;box-shadow:none!important}
 html[data-bubble-style=liquid] body #tabBar .tab,
 html[data-bubble-style=liquid] body[data-page=chat] #composer :is(textarea,#addButton,#voiceButton,#stickerButton){color:CanvasText!important}
 html[data-bubble-style=liquid][data-theme] body #tabBar .tab[aria-current=page]{background:Highlight!important;color:HighlightText!important;box-shadow:none!important}
 .liquid-background,.liquid-optics{display:none!important}
}