/* The message box is the real bubble boundary; raster artwork has no centre cell. */
.premium .chat-list{gap:calc(var(--gap) + 20px);padding-top:26px}
.premium .message{position:relative;isolation:isolate;align-self:flex-start;align-items:flex-start;width:100%;min-height:0;padding:max(10px,var(--padding)) calc(var(--padding) + 26px);border:var(--border) solid var(--outline);border-radius:clamp(4px,var(--radius),20px);background:var(--bubble);overflow:visible;box-shadow:inset 0 0 8px color-mix(in srgb,var(--accent),transparent 86%),0 3px calc(var(--shadow) * 1px) #0002}
.premium .message::before{content:'';position:absolute;inset:3px;border:1px solid color-mix(in srgb,var(--accent),transparent 65%);border-radius:inherit;pointer-events:none}
.premium .message-fill{display:none}
.premium-art{position:absolute;inset:0;display:block;pointer-events:none;z-index:1;filter:hue-rotate(var(--asset-hue)) saturate(var(--asset-saturation)) brightness(var(--asset-brightness))}
.art-defs{position:absolute;width:0;height:0}.art-cell{position:absolute;display:block;overflow:hidden}
.premium .message-content,.premium .badge{position:relative;z-index:2}
.message-content{overflow-wrap:anywhere}
.premium .message-content{flex:1;min-width:0;font-size:var(--size);line-height:var(--line);letter-spacing:var(--tracking);font-weight:var(--weight)}
.frame-mini[class*="premium-"]{width:84px;height:30px;position:relative;border:1px solid #b3a4cc;background:linear-gradient(110deg,#fff2,#b8a8d822);border-radius:7px}
.frame-mini[class*="premium-"]::before{content:'✧';position:absolute;left:5px;top:-7px;color:#ddd0f3;font-size:15px}
.frame-mini.premium-cat-ears::before,.frame-mini.premium-cat-tail::before{content:'◢  ◣';font-size:10px}
.frame-mini.premium-bunny::before{content:'∩ ∩';font-size:15px;top:-13px}
.frame-mini.premium-fox::before{content:'◢ ◣';color:#dbc3b7;font-size:10px}
.frame-mini.premium-frog::before{content:'◉  ◉';font-size:10px;color:#b6d1c5}
.frame-mini.premium-bear::before{content:'●  ●';font-size:11px;color:#d3c1b5}
.frame-mini.premium-paw::before{content:'✿';left:auto;right:1px;top:12px}
.frame-mini.premium-slime::before{content:'◕';left:auto;right:1px;top:12px}
.chat-wrap{touch-action:none}
body:has(.overlay-mode){background:transparent;min-width:0}
.overlay-mode .chat-wrap{width:var(--width);max-width:none;min-height:420px;background:var(--canvas);box-shadow:none}
.test-controls{display:flex;align-items:center;gap:8px;margin-left:12px}
.test-controls select{font:11px Arial;color:#d8d4e5;background:#282936;border:1px solid #424052;border-radius:5px;padding:4px}
.test-controls input{width:170px;background:#282936;color:#eee;border:1px solid #424052;border-radius:5px;padding:5px;font:11px Arial}
/* Taller rabbit ears need clearance between bubbles, not extra text padding. */
.premium-bunny .chat-list{gap:calc(var(--gap) + 36px);padding-top:40px}
