/* Call composer: consistent glass, stable width and restrained focus transitions. */
.fd-composer-dock{position:absolute;z-index:3;left:var(--fd-general-card-gap,1.0625rem);right:calc(var(--fd-room-width,18.25rem) + 2 * var(--fd-general-card-gap,1.0625rem));bottom:var(--fd-general-card-gap,1.0625rem);container-type:inline-size}
.fd-composer{--composer-ink:#30333a;--composer-soft:#777b85;--composer-face:#ffffff75;--composer-card-face:#ffffff57;--composer-line:#ffffffb3;--composer-accent:#4179b0;display:flex;flex-direction:column;gap:0.5rem;width:100%;margin:0;color:var(--composer-ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:0.8125rem}
.fd-composer-card{border:1px solid var(--composer-line);border-radius:1.125rem;background:var(--composer-card-face);backdrop-filter:blur(0.375rem);-webkit-backdrop-filter:blur(0.375rem);box-shadow:inset 0 1px 1px #ffffff70,0 0.1875rem 0.75rem #00000008;overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.fd-composer.is-split .fd-composer-card,.fd-composer.is-split .fd-composer-actions{overflow:visible}
.fd-composer-card:focus-within{border-color:#7a9fbe8c;box-shadow:inset 0 1px 1px #ffffff60,0 0 0 0.125rem #4179b00c}
.fd-composer-input{display:block;box-sizing:border-box;width:100%;min-height:2.5rem;max-height:8.5rem;padding:0.75rem 0.875rem 0.375rem;border:0;outline:0;resize:none;background:transparent;color:var(--composer-ink);font:inherit;line-height:1.25rem;scrollbar-width:thin;overflow-y:auto}
.fd-composer-input::placeholder{color:var(--composer-soft);opacity:1;font-weight:400}
.fd-composer-input:disabled{opacity:.65}
.fd-composer-actions{display:flex;align-items:center;gap:0.375rem;padding:0.25rem 0.5rem 0.5rem}
.fd-composer-actions button{display:grid;place-items:center;flex:0 0 1.875rem;width:1.875rem;height:1.875rem;padding:0;border:1px solid #ffffff30;border-radius:50%;background:#ffffff18;color:var(--composer-soft);cursor:pointer;box-shadow:inset 0 1px 1px #ffffff40;transition:background .18s,color .18s,opacity .18s}
.fd-composer-actions button svg{width:0.9375rem;height:0.9375rem}
.fd-composer-actions button:hover:not(:disabled){background:#ffffff60;color:var(--composer-ink)}
.fd-composer-actions button:disabled{opacity:.35;cursor:default}
.fd-composer-actions button:focus-visible,.fd-composer-thumb button:focus-visible{outline:0.125rem solid #78b9ff;outline-offset:0.125rem}
.fd-composer-actions .fd-composer-send{background:#4179b024;color:#356b9f;border-color:#4179b02b}
.fd-composer-actions .fd-composer-send:hover:not(:disabled){background:#4179b03b;color:#285b8b}
.fd-composer-room-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:0.6875rem;color:var(--composer-soft);padding:0 0.25rem}
.fd-composer-mic[hidden]{display:none}
.fd-composer.is-recording .fd-composer-mic{color:#d56d6d;border-color:#d56d6d50;background:#d56d6d12;animation:fd-composer-recording 1.8s ease-in-out infinite}
@keyframes fd-composer-recording{50%{box-shadow:0 0 0 0.1875rem #d56d6d12}}
.fd-composer-thumbs{display:flex;gap:0.5rem;overflow-x:auto;padding:0.125rem;scrollbar-width:thin}.fd-composer-thumbs:empty{display:none}
.fd-composer-thumb{position:relative;flex:0 0 3rem;width:3rem;height:3rem;border-radius:0.625rem;border:1px solid var(--composer-line);background:var(--composer-face)}
.fd-composer-thumb>button:first-child{display:block;width:100%;height:100%;border:0;padding:0;background:none;border-radius:inherit;overflow:hidden;cursor:pointer}
.fd-composer-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.fd-composer-thumb-remove{position:absolute;right:-0.125rem;top:-0.125rem;display:grid;place-items:center;width:1.0625rem;height:1.0625rem;padding:0;border:1px solid var(--composer-line);border-radius:50%;background:#f2f3f5;color:#52555e;cursor:pointer;font-size:0.8125rem}
.fd-composer-thumb-remove:disabled{opacity:.4}
.fd-composer-gallery{max-width:86vw;max-height:82dvh;border:1px solid #ffffff50;border-radius:1.125rem;padding:0;background:#efeff2;box-shadow:0 1rem 3rem #00000035}
.fd-composer-gallery::backdrop{background:#16181b70;backdrop-filter:blur(0.3125rem)}
.fd-composer-gallery img{display:block;max-width:86vw;max-height:82dvh;object-fit:contain}
.fd-composer-gallery-close{position:absolute;right:0.625rem;top:0.625rem;width:1.875rem;height:1.875rem;border:1px solid #ffffff70;border-radius:50%;background:#ffffffd9;color:#34363b;font-size:1.375rem;cursor:pointer}
.fd-app-dark .fd-composer{--composer-ink:#dedee3;--composer-soft:#93969e;--composer-face:#ffffff08;--composer-card-face:#ffffff05;--composer-line:#ffffff26}
.fd-app-dark .fd-composer-card{box-shadow:inset 0 1px 1px #ffffff10,0 0.1875rem 0.75rem #00000012}
.fd-app-dark .fd-composer-card:focus-within{border-color:#8aa6c052;box-shadow:inset 0 1px 1px #ffffff18,0 0 0 0.125rem #78b9ff08}
.fd-app-dark .fd-composer-actions button:hover:not(:disabled){background:#ffffff14}
.fd-app-dark .fd-composer-actions .fd-composer-send{color:#a6c7e4;background:#7caad51c;border-color:#7caad528}
.fd-app-dark .fd-composer-thumb-remove,.fd-composer-gallery.is-dark{background:#292b30;color:#ddd}
@container(max-width:220px){.fd-composer-room-label{font-size:0.625rem}.fd-composer-actions{gap:0.1875rem}.fd-composer-input{padding-inline:0.625rem}}
/* One emotion trigger; V1 tabs and search live in the shared popover. */
.fd-composer{position:relative}
.fd-composer-emotion{position:absolute;z-index:8;left:0;bottom:calc(100% + 0.625rem);display:flex;flex-direction:column;width:min(22.5rem,100%);height:var(--emotion-height,24.375rem);max-height:var(--emotion-height,24.375rem);min-height:0;box-sizing:border-box;overflow:hidden;padding:0.625rem;border:1px solid #ffffffa6;border-radius:1.375rem;background:linear-gradient(135deg,#ffffff94,#eeeeee80 58%,#ffffff54);backdrop-filter:blur(1.125rem) saturate(1.1);-webkit-backdrop-filter:blur(1.125rem) saturate(1.1);color:var(--composer-ink);box-shadow:inset 0 1px 1px #ffffffc0,inset 0 -1px 1px #ffffff45,0 0.625rem 1.75rem #00000014;transform-origin:bottom right;animation:fd-emotion-open .22s cubic-bezier(.22,1,.36,1)}
.fd-composer-emotion[hidden]{display:none}
.fd-composer-emotion .call-express-tabs{display:flex;gap:0.1875rem;padding:0.1875rem;background:#8888880a;border-radius:0.5625rem}
.fd-composer-emotion .call-express-tab{flex:1;min-width:0;padding:0.5rem 0.1875rem;border:0;border-radius:0.4375rem;background:transparent;color:var(--composer-soft);font:inherit;font-size:0.75rem;cursor:pointer}
.fd-composer-emotion .call-express-tab.is-on{background:#ffffffb3;color:#4179b0;box-shadow:0 1px 0.1875rem #00000008}
.fd-composer-emotion .call-emoji-cats{display:flex;justify-content:space-between;gap:0.125rem;margin-top:0.5rem}
.fd-composer-emotion .call-emoji-cat,.fd-composer-emotion .call-emoji-cell{display:grid;place-items:center;min-width:0;border:0;border-radius:0.4375rem;background:transparent;cursor:pointer;min-height:1.875rem;font-size:0.9375rem}
.fd-composer-emotion .call-emoji-cat{flex:1;font-size:0.8125rem}
.fd-composer-emotion button:hover,.fd-composer-emotion .call-emoji-cat.is-on{background:#88888810}
.fd-composer-emotion button:focus-visible{outline:0.125rem solid #78b9ff;outline-offset:-0.125rem}
.fd-composer-emotion input{box-sizing:border-box;width:100%;margin-top:0.5rem;padding:0.5625rem 0.625rem;border:1px solid #88888825;border-radius:0.5rem;background:#88888805;color:var(--composer-ink);font:inherit;font-size:0.75rem;outline:0}
.fd-composer-emotion input:focus{border-color:#78b9ff80}
.fd-composer-emotion .call-emoji-label{margin:0.625rem 0 0.375rem;font-size:0.625rem;font-weight:600;text-transform:uppercase;color:var(--composer-soft)}
.fd-composer-emotion .call-emoji-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));flex:1;min-height:0;max-height:none;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#85858570 transparent;gap:0.1875rem;align-content:start;overscroll-behavior:contain}
.fd-composer-emotion .call-emoji-empty{grid-column:1/-1;font-size:0.75rem;color:var(--composer-soft)}
.fd-composer-emotion .call-express-soon{text-align:center;padding:1.125rem 0.75rem;font-size:0.75rem;color:var(--composer-soft)}
.fd-composer-emotion .call-express-soon svg{display:block;width:4.375rem;height:4.375rem;margin:0 auto 0.75rem}
.fd-app-dark .fd-composer-emotion{background:linear-gradient(135deg,#423e3ef0,#312e2eeb 58%,#393535eb);border-color:#ffffff30;box-shadow:inset 0 1px 1px #ffffff30,inset 0 -1px 1px #ffffff0d,0 0.625rem 1.75rem #00000026}.fd-app-dark .fd-composer-emotion .call-express-tab.is-on{background:#ffffff0d;color:#a6c7e4}
/* Compact single row: attachment, text, emotion, microphone and send. */
.fd-composer-actions{padding:0.375rem 0.5rem;gap:0.375rem}
.fd-composer-actions .fd-composer-input{flex:1 1 0;min-width:0;width:0;min-height:2.25rem;padding:0.5rem 0.25rem;align-self:center;scrollbar-width:none}
.fd-composer-actions .fd-composer-input::-webkit-scrollbar{width:0;height:0;display:none}
.fd-composer-scroll{position:relative;flex:0 0 0.5rem;align-self:stretch;margin-block:0.375rem;cursor:pointer}
.fd-composer-scroll[hidden]{display:none!important}
.fd-composer-scroll-thumb{position:absolute;left:0;width:0.5rem;background:transparent;touch-action:none}
.fd-composer-scroll-thumb::before{content:"";position:absolute;left:0.125rem;top:0;bottom:0;width:0.1875rem;border-radius:6.1875rem;background:#85878e73}
.fd-composer-scroll-thumb:hover::before{background:#85878e99}
.fd-app-dark .fd-composer-scroll-thumb::before{background:#ffffff59}
.fd-app-dark .fd-composer-scroll-thumb:hover::before{background:#ffffff80}
.fd-composer-room-label{display:none}
@container(max-width:220px){.fd-composer-actions{gap:0.1875rem;padding-inline:0.3125rem}.fd-composer-actions button{flex-basis:1.625rem;width:1.625rem;height:1.625rem}.fd-composer-actions .fd-composer-input{padding-inline:0.125rem}}
/* 21st ai-chat-input primary button: original icon geometry and 300ms spring transition. */
.fd-composer-actions .fd-composer-send[hidden]{display:none}
.fd-composer-actions .fd-composer-primary{position:relative;flex:0 0 2rem;width:2rem;height:2rem;border:0;border-radius:624.9375rem;background:#171717;color:#fafafa;box-shadow:none;transition:all 300ms;animation:none}
.fd-composer-actions .fd-composer-primary:hover:not(:disabled){background:#171717;color:#fafafa;opacity:.9}
.fd-composer-primary-icons{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.fd-composer-primary-icons>span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.5) rotate(45deg);filter:blur(1px);pointer-events:none;transition:all 300ms cubic-bezier(.175,.885,.32,1.275)}
.fd-composer-primary[data-mode="send"] [data-primary-icon="send"],.fd-composer-primary[data-mode="mic"] [data-primary-icon="mic"],.fd-composer-primary[data-mode="pause"] [data-primary-icon="pause"],.fd-composer-primary[data-mode="rec"] [data-primary-icon="rec"],.fd-composer-primary[data-mode="play"] [data-primary-icon="play"],.fd-composer-primary[data-mode="stop"] [data-primary-icon="stop"]{opacity:1;transform:scale(1) rotate(0deg);filter:blur(0)}
.fd-composer-actions .fd-composer-primary svg{width:auto;height:auto}
.fd-app-dark .fd-composer-actions .fd-composer-primary{background:#fafafa;color:#171717}
.fd-app-dark .fd-composer-actions .fd-composer-primary [data-primary-icon="mic"]{color:#f4f5f7}
.fd-app-dark .fd-composer-actions .fd-composer-primary:hover:not(:disabled){background:#fafafa;color:#171717}
/* Preserve the explicitly requested icon morph even when generic composer transitions are disabled. */
.fd-composer .fd-composer-primary-icons>span{transition:all 300ms cubic-bezier(.175,.885,.32,1.275)!important}
.fd-composer.is-recording .fd-composer-primary{background:#171717;color:#fafafa;box-shadow:none;animation:none}
.fd-app-dark .fd-composer.is-recording .fd-composer-primary{background:#fafafa;color:#171717}

.fd-composer-primary-icons>[data-primary-icon='mic']{transform:scale(.5) rotate(-45deg)}

/* C25: live microphone envelope replaces the input only while dictating. */
.fd-composer-actions .fd-composer-input[hidden],.fd-composer-audio-wave[hidden]{display:none!important}
.fd-composer.is-split .fd-composer-actions .fd-composer-input{display:none!important}
.fd-composer.is-split:not(.is-sending) .fd-composer-actions .fd-composer-audio{display:flex!important}
.fd-composer-actions .fd-composer-audio{display:flex;flex:1 1 0;align-items:center;gap:0.5rem;min-width:0;width:0;height:2.25rem;margin:0 0.25rem}
.fd-composer-actions .fd-composer-audio[hidden]{display:none!important}
.fd-composer-audio-wave{display:block;flex:1 1 0;min-width:0;width:0;height:2.25rem;margin:0;color:rgba(23,23,23,.72)}
.fd-app-dark .fd-composer-audio-wave{color:rgba(250,250,250,.78)}
.fd-composer-audio-time{flex:0 0 auto;width:0;overflow:hidden;opacity:0;color:var(--composer-ink);font-size:0.75rem;font-variant-numeric:tabular-nums;line-height:1}
.fd-composer-audio.is-review .fd-composer-audio-time{width:auto;overflow:visible;opacity:.82}
.fd-composer .fd-composer-actions button.fd-composer-audio-play{position:relative;flex:0 0 0;width:0;height:2.25rem;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:var(--composer-ink);overflow:hidden;opacity:0;pointer-events:none;cursor:pointer}
.fd-composer-audio.is-review button.fd-composer-audio-play{flex-basis:1.375rem;width:1.375rem;overflow:visible;opacity:1;pointer-events:auto}
.fd-composer .fd-composer-actions button.fd-composer-audio-play:hover:not(:disabled),.fd-composer .fd-composer-actions button.fd-composer-audio-play:active:not(:disabled){background:transparent;color:var(--composer-ink);box-shadow:none;transform:none}
.fd-composer-audio-play .fd-audio-play-glyph{position:absolute;inset:0;width:0.75rem;height:0.875rem;margin:auto;display:block}
.fd-composer-audio [data-wave-icon="pause"]{opacity:0}
.fd-composer-audio.is-playing [data-wave-icon="play"]{opacity:0!important;animation:none!important}
.fd-composer-audio.is-playing [data-wave-icon="pause"]{opacity:1!important}
.fd-composer-audio.is-review.is-assembling button.fd-composer-audio-play{animation:fd-audio-play-slot .46s cubic-bezier(.16,1,.3,1) both!important}
.fd-composer-audio.is-assembling [data-wave-icon="play"]{transform-origin:left center;animation:fd-audio-play-build .46s cubic-bezier(.16,1,.3,1) both!important}
.fd-composer-audio.is-review.is-assembling .fd-composer-audio-time{animation:fd-audio-time-in .46s ease both!important}
@keyframes fd-audio-play-slot{0%{flex-basis:0;width:0;opacity:0}100%{flex-basis:1.375rem;width:1.375rem;opacity:1}}
@keyframes fd-audio-play-build{0%{opacity:0;transform:scale(.2);clip-path:inset(18% 78% 18% 0)}70%{opacity:1;transform:scale(1.06);clip-path:inset(0)}100%{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes fd-audio-time-in{from{opacity:0}to{opacity:.82}}

/* C23: anchored picker, with only the emoji grid scrolling. */
/* Emotion face trigger: sad at rest, happy on hover, focus or while the picker is open. */
.fd-composer-actions button.fd-composer-emotion-button{padding:0;border:0;border-radius:50%;background:none;box-shadow:0 0.1875rem 0.375rem #00000020;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease}
.fd-composer-actions button.fd-composer-emotion-button:hover:not(:disabled){background:none;transform:none;box-shadow:0 0.25rem 0.5rem #00000026}
.fd-composer-actions button.fd-composer-emotion-button:active:not(:disabled){transform:none;box-shadow:0 1px 0.125rem #00000018}
.fd-composer-actions button.fd-composer-emotion-button:disabled{opacity:.78}
.fd-composer-actions button.fd-composer-emotion-button svg.fd-emotion-face{display:block;width:100%;height:100%;overflow:visible}
.fd-emotion-skin{fill:#f7d034;stroke:#fff;stroke-width:3}
.fd-emotion-eye{fill:#000;transform-box:fill-box;transform-origin:center}
.is-blinking .fd-emotion-eye{transform:scaleY(.08)}
.fd-emotion-mouth{transform-box:fill-box;transform-origin:center;transition:transform .25s ease}
.fd-emotion-sad{fill:none;stroke:#000;stroke-width:4.5;stroke-linecap:round;transform-box:fill-box;transform-origin:50% 100%;transition:opacity .18s ease,transform .25s cubic-bezier(.34,1.56,.64,1)}
.fd-emotion-happy{fill:#f11622;transform-box:fill-box;transform-origin:50% 0;opacity:0;transform:scaleY(0);transition:opacity .18s ease,transform .28s cubic-bezier(.34,1.56,.64,1)}
.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled) .fd-emotion-sad{opacity:0;transform:scaleY(-.4)}
.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled) .fd-emotion-happy{opacity:1;transform:none}
.fd-composer-emotion>:not(.call-emoji-grid){flex-shrink:0}
.fd-composer-emotion .call-express-soon{min-height:0;flex:1;overflow:hidden}
.fd-composer-emotion .call-emoji-grid::-webkit-scrollbar{width:0.25rem}
.fd-composer-emotion .call-emoji-grid::-webkit-scrollbar-track{background:transparent}
.fd-composer-emotion .call-emoji-grid::-webkit-scrollbar-thumb{border-radius:0.5rem;background-color:#85858570;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.22' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes fd-emotion-open{from{opacity:0;transform:translateY(0.3125rem) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.fd-composer-emotion .call-emoji-grid::-webkit-scrollbar-button{display:none;width:0;height:0}


/* C26 — room timeline: quiet glass, no upper toolbar. */
.fd-call-timeline{position:absolute;z-index:2;top:var(--fd-general-card-gap,1.0625rem);left:var(--fd-general-card-gap,1.0625rem);right:calc(var(--fd-room-width,18.25rem) + 2 * var(--fd-general-card-gap,1.0625rem));bottom:5rem;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding:0.625rem 0.75rem;box-sizing:border-box;border-radius:1.125rem;color:#34363c;font:0.8125rem/1.6 Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;scrollbar-width:thin;scrollbar-color:#85858570 transparent;overflow-anchor:none}
.fd-call-timeline:focus-visible{outline:1px solid #789bb080;outline-offset:-1px}
.fd-timeline-content{display:flex;flex-direction:column;gap:0.625rem;min-width:0}
.fd-timeline-day{display:flex;align-items:center;gap:0.75rem;padding:0.5rem 0;color:#808187;font-size:0.625rem;letter-spacing:.02em;text-align:center}
.fd-timeline-day:before,.fd-timeline-day:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,#88888825,transparent)}
.fd-timeline-message{display:flex;align-items:flex-start;gap:0.625rem;padding:0.6875rem 0.75rem;margin:0;border:1px solid #ffffff65;border-radius:1rem;background:linear-gradient(135deg,#ffffff35,#ffffff12);box-shadow:inset 0 1px 1px #ffffff50;min-width:0}
.fd-timeline-avatar{position:relative;display:grid;place-items:center;flex:0 0 1.875rem;width:1.875rem;height:1.875rem;overflow:hidden;border-radius:50%;background:#88888814;border:1px solid #ffffff65;color:#777b83;font-size:0.75rem}
.fd-timeline-avatar:has(img){color:transparent;font-size:0}.fd-timeline-avatar img{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:cover}
.fd-timeline-body{flex:1;min-width:0}.fd-timeline-meta{display:flex;align-items:baseline;gap:0.5rem;flex-wrap:wrap}.fd-timeline-meta strong{font-size:0.75rem;font-weight:600}.fd-timeline-meta time,.fd-timeline-edited{font-size:0.625rem;color:#85868c}
.fd-timeline-text{margin:0.25rem 0 0;white-space:pre-wrap;overflow-wrap:anywhere}.fd-timeline-text.is-emoji-only{font-size:1.625rem}.fd-timeline-text a,.fd-timeline-file{color:#507ba0;text-decoration:none}.fd-timeline-text a:hover,.fd-timeline-file:hover{text-decoration:underline}
.fd-timeline-quote{margin:0.4375rem 0;padding:0.3125rem 0.5625rem;border-left:0.125rem solid #8395a760;background:#88888808;border-radius:0 0.4375rem 0.4375rem 0;font-size:0.6875rem;color:#777b85}.fd-timeline-quote strong,.fd-timeline-quote span{display:block;overflow-wrap:anywhere}
.fd-timeline-image{display:block;width:fit-content;max-width:100%;margin-top:0.5rem;border-radius:0.75rem;overflow:hidden}.fd-timeline-image img{display:block;max-width:100%;max-height:16.25rem;object-fit:contain}
.fd-timeline-media{display:block;max-width:100%;max-height:16.25rem;margin-top:0.5rem;border-radius:0.75rem}.fd-timeline-file{display:inline-block;margin-top:0.4375rem;padding:0.4375rem 0.625rem;border:1px solid #88888820;border-radius:0.5625rem;overflow-wrap:anywhere}
.fd-timeline-reactions{display:flex;flex-wrap:wrap;gap:0.3125rem;margin-top:0.4375rem}.fd-timeline-reactions span{padding:1px 0.4375rem;border:1px solid #88888818;border-radius:1.25rem;background:#ffffff20;font-size:0.6875rem}
.fd-timeline-message.is-system{border-color:transparent;background:#88888806;box-shadow:none}.fd-timeline-deleted{font-size:0.75rem;color:#85868c;font-style:italic;margin:0.25rem 0}.fd-timeline-status{margin:1.25rem 0;text-align:center;font-size:0.75rem;color:#85868c}.fd-timeline-status[hidden]{display:none}
.fd-app-dark .fd-call-timeline{color:#dedee3}.fd-app-dark .fd-timeline-message{background:linear-gradient(135deg,#ffffff08,#ffffff02);border-color:#ffffff12;box-shadow:inset 0 1px 1px #ffffff08}.fd-app-dark .fd-timeline-avatar{border-color:#ffffff20;background:#ffffff08}.fd-app-dark .fd-timeline-text a,.fd-app-dark .fd-timeline-file{color:#a6c7e4}.fd-app-dark .fd-timeline-reactions span{background:#ffffff08}.fd-app-dark .fd-timeline-message.is-system{background:#ffffff03;border-color:transparent;box-shadow:none}
.fd-call-timeline::-webkit-scrollbar{width:0.25rem}.fd-call-timeline::-webkit-scrollbar-track{background:transparent}.fd-call-timeline::-webkit-scrollbar-thumb{border-radius:0.5rem;background:#85858570}.fd-call-timeline::-webkit-scrollbar-button{display:none}

/* C27 — reference selection toolbar: same dark finish in both themes. */
.fd-selection-toolbar,.fd-selection-menu{position:fixed;box-sizing:content-box;z-index:100;background:rgba(24,24,27,.92);color:#fff;backdrop-filter:blur(1rem);-webkit-backdrop-filter:blur(1rem);border:1px solid #ffffff17;border-radius:0.625rem;box-shadow:0 0.625rem 1.5625rem -0.3125rem #0000004d,0 0.5rem 0.625rem -0.375rem #0000004d;font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.fd-selection-toolbar{display:flex;align-items:center;gap:0.125rem;padding:0.1875rem;border-radius:0.5rem;transform:translateX(-50%);will-change:transform}
.fd-selection-toolbar[hidden],.fd-selection-menu[hidden]{display:none}
.fd-selection-toolbar button{display:flex;align-items:center;justify-content:center;position:relative;border:0;outline:0;background:transparent;color:#fff;cursor:pointer;padding:0.375rem 0.46875rem;border-radius:0.3125rem;transition:all .15s ease;-webkit-tap-highlight-color:transparent}
.fd-selection-toolbar svg,.fd-selection-menu svg{display:block;flex-shrink:0;width:1rem;height:1rem}
.fd-selection-toolbar button:hover,.fd-selection-toolbar button[aria-expanded='true'],.fd-selection-toolbar button.is-speaking,.fd-selection-menu button:hover{background:#ffffff1f}
.fd-selection-toolbar button:is(:hover,:focus-visible,.is-raised){transform:translateY(-0.1875rem)}
.fd-selection-toolbar button:is(:hover,:focus-visible):active,.fd-selection-toolbar button:active,.fd-selection-menu button:active{transform:scale(.94)}
.fd-selection-toolbar button:focus-visible,.fd-selection-menu button:focus-visible{outline:1px solid #ffffff80;outline-offset:-0.125rem;background:#ffffff1f}
.fd-selection-toolbar button.is-copied,.fd-selection-menu button.is-copied{color:#4ade80}
.fd-selection-toolbar button.is-speaking{color:#f87171}.fd-selection-toolbar button.is-speaking svg{animation:fd-selection-speaking .8s ease-in-out infinite}
.fd-selection-menu{z-index:101;width:12.8125rem;max-height:18.125rem;overflow-y:auto;padding:0.375rem;scrollbar-width:thin;scrollbar-color:#88888880 transparent}
.fd-selection-menu-title{font-size:0.625rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:0.25rem 0.5rem 0.375rem;opacity:.5;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.fd-selection-menu button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0.4375rem 0.625rem;box-sizing:border-box;border:0;background:transparent;color:#fff;border-radius:0.375rem;font:0.8125rem/normal inherit;cursor:pointer;text-align:left;transition:background .15s ease;font-family:inherit;font-size:0.8125rem}
.fd-selection-option-name{display:flex;align-items:center;gap:0.5rem}.fd-selection-dot{width:0.5rem;height:0.5rem;flex:0 0 0.5rem;border-radius:50%}.fd-selection-badge{font-size:0.625rem;opacity:.5;text-transform:uppercase;letter-spacing:.05em}.fd-selection-option-icon{display:flex;align-items:center}
.fd-call-timeline ::selection{background:#315ed1;color:#fff}
::highlight(fd-call-selection){background:rgba(250,204,21,.35);color:inherit}
.fd-call-timeline{-webkit-touch-callout:none}
@keyframes fd-selection-speaking{50%{transform:scale(1.2)}}
@media(max-width:350px){.fd-selection-toolbar button{padding-inline:0.4375rem}.fd-selection-toolbar{gap:0.125rem}}
/* C27: compact selection actions, approximately 25% smaller. */
.fd-selection-toolbar svg{width:0.75rem;height:0.75rem}
/* Attach "+" and send orbs: Uiverse santhosh_2608 "serious-otter-93" (MIT) on the current colors, plus the catraco
   "fluffy-quail-74" quarter turn on the "+". 1em is a fifth of the button and reference px are divided by the 13.33px
   em of the Uiverse preview, so every measure keeps the proportion seen there; !important keeps the requested motion
   when the OS reduced-motion rule above is active. */
.fd-composer-actions .fd-composer-attach{position:relative;overflow:hidden;flex:0 0 2rem;width:2rem;height:2rem;font-size:0.375rem;border:1px solid rgba(255,255,255,.85);background:linear-gradient(180deg,#fff,#f7f7f8);color:#171717;box-shadow:inset 0 1px 1px #fff,inset 0 -1px 0.125rem rgba(0,0,0,.06),0 0.125rem 0.3125rem rgba(0,0,0,.08);filter:none;-webkit-tap-highlight-color:transparent;transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s cubic-bezier(.2,.8,.2,1),opacity .18s!important}
.fd-app-dark .fd-composer-actions .fd-composer-attach{border-color:rgba(255,255,255,.25);background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.06));color:#f4f4f5;box-shadow:inset 0 1px 1px rgba(255,255,255,.22),inset 0 -1px 0.125rem rgba(0,0,0,.35),0 0.125rem 0.375rem rgba(0,0,0,.2)}
.fd-composer .fd-composer-actions .fd-composer-attach:hover:not(:disabled){transform:scale(1.06);background:linear-gradient(180deg,#fff,#f7f7f8);color:#171717;box-shadow:inset 0 1px 1px #fff,0 0 0.875rem rgba(255,255,255,.75),0 0.25rem 0.625rem rgba(0,0,0,.08)}
.fd-app-dark .fd-composer .fd-composer-actions .fd-composer-attach:hover:not(:disabled){background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.08));color:#f4f4f5;box-shadow:inset 0 1px 1px rgba(255,255,255,.35),0 0 0.875rem rgba(255,255,255,.2),0 0.25rem 0.625rem rgba(0,0,0,.25)}
.fd-composer .fd-composer-actions .fd-composer-attach:hover:not(:disabled) svg{filter:drop-shadow(0 0 .3em rgba(255,255,255,.55))}
.fd-composer .fd-composer-actions .fd-composer-attach:active:not(:disabled){transform:scale(.92);box-shadow:inset 0 1px 0.125rem rgba(0,0,0,.12),0 1px 0.1875rem rgba(0,0,0,.1)}
.fd-composer-actions :is(.fd-composer-attach,.fd-composer-primary)::before{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(160deg,rgba(255,255,255,.5) 0%,transparent 46%);pointer-events:none;z-index:0;box-shadow:none}
.fd-composer-actions :is(.fd-composer-attach,.fd-composer-primary)::after{content:"";position:absolute;top:0;left:-150%;width:50%;height:100%;background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,.3) 50%,rgba(255,255,255,0) 100%);transform:skewX(-25deg);z-index:1;pointer-events:none}
.fd-composer .fd-composer-actions .fd-composer-attach:hover:not(:disabled)::after,.fd-composer .fd-composer-actions .fd-composer-primary.is-launching::after{animation:fd-orb-shimmer .8s ease-out forwards!important}
@keyframes fd-orb-shimmer{0%{left:-150%}100%{left:200%}}
.fd-composer-actions .fd-composer-attach svg{position:relative;z-index:2;width:2.125em;height:2.125em;stroke-width:2;filter:none;transition:all .6s cubic-bezier(.16,1,.3,1),rotate .3s ease!important}
.fd-composer:not(.is-split) .fd-composer-actions .fd-composer-attach:hover:not(:disabled) [data-attach-icon="plus"] svg{transform:scale(1.15) rotate(180deg);rotate:90deg}
.fd-attach-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:opacity .45s cubic-bezier(.23,1,.32,1),transform .55s cubic-bezier(.23,1,.32,1)!important}
.fd-attach-face[data-attach-icon="cancel"]{opacity:0;transform:scale(.45)}
.fd-composer.is-split .fd-attach-face[data-attach-icon="plus"]{opacity:0;transform:scale(.45) rotate(90deg)}
.fd-composer.is-split .fd-attach-face[data-attach-icon="cancel"]{opacity:1;transform:none}
/* Cancel disc: Uiverse Javierrocadev "curly-wolverine-36" X only. Rest is red-300, hover is red-500; the cutout stays light so the X reads faded, then white. */
.fd-composer.is-split .fd-composer-actions .fd-composer-attach.is-cancel{border:0;background:#f7f7f8;color:#fca5a5;box-shadow:none;overflow:hidden;transition:transform .12s cubic-bezier(.2,.8,.2,1),color .2s ease,background .2s ease!important}
.fd-composer.is-split .fd-composer-actions .fd-composer-attach.is-cancel::before,.fd-composer.is-split .fd-composer-actions .fd-composer-attach.is-cancel::after{content:none}
.fd-composer.is-split .fd-composer-attach.is-cancel [data-attach-icon="cancel"] svg{width:1.875rem;height:1.875rem;transform:scale(1.34);stroke:none;filter:none;transition:none!important}
.fd-composer.is-split .fd-composer-actions .fd-composer-attach.is-cancel:hover:not(:disabled){transform:none;background:#f7f7f8;color:#ef4444;box-shadow:none}
.fd-composer.is-split .fd-composer-attach.is-cancel:hover:not(:disabled) svg{filter:none;transform:scale(1.34)}
.fd-composer.is-split .fd-composer-actions .fd-composer-attach.is-cancel:active:not(:disabled){transform:scale(.92);background:#f7f7f8;color:#ef4444;box-shadow:none}
.fd-attach-face{z-index:2}
@container(max-width:220px){.fd-composer-actions .fd-composer-attach{flex-basis:1.625rem;width:1.625rem;height:1.625rem;font-size:0.325rem}}
/* Send orb: the reference look appears with text; press, jump, shimmer and arrow flight run only when a message is sent. */
.fd-composer-actions .fd-composer-primary{--fd-orb-glow:23,23,23;overflow:hidden;font-size:0.4rem;transition:all 300ms,transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s cubic-bezier(.2,.8,.2,1)!important}
.fd-app-dark .fd-composer-actions .fd-composer-primary{--fd-orb-glow:250,250,250}
.fd-composer-actions .fd-composer-primary::before{background:linear-gradient(145deg,rgba(255,255,255,.25) 0%,transparent 40%,rgba(0,0,0,.5) 100%),radial-gradient(circle at 50% 50%,rgba(0,0,0,.1) 0%,rgba(var(--fd-orb-glow),.08) 50%,rgba(var(--fd-orb-glow),.35) 100%);opacity:0;transition:opacity 300ms!important}
.fd-composer-actions .fd-composer-primary:is([data-mode="send"],.is-fx)::before{opacity:1}
.fd-composer-actions .fd-composer-primary:is([data-mode="send"],.is-fx){box-shadow:inset 0 0 1.875em .15em rgba(var(--fd-orb-glow),.35),inset 0 0 .6em .075em rgba(var(--fd-orb-glow),.6),0 0 1.25em 0 rgba(var(--fd-orb-glow),.12)}
.fd-composer .fd-composer-actions .fd-composer-primary.is-pressing{transform:scale(.92);box-shadow:inset 0 0 2.625em .375em rgba(var(--fd-orb-glow),.8),inset 0 0 1.125em .3em rgba(255,255,255,.7),0 0 1.1em .1em rgba(var(--fd-orb-glow),.18)}
.fd-composer .fd-composer-actions .fd-composer-primary.is-launching{transform:scale(1.06);box-shadow:inset 0 0 2.25em .3em rgba(var(--fd-orb-glow),.45),inset 0 0 .9em .15em rgba(var(--fd-orb-glow),.7),0 0 1.6em .1em rgba(var(--fd-orb-glow),.16)}
.fd-composer-actions .fd-composer-primary.is-fx:disabled{opacity:1}
.fd-composer-actions .fd-composer-primary .fd-composer-primary-icons{z-index:2}
.fd-composer-actions .fd-composer-primary [data-primary-icon="send"] svg{width:2.125em;height:2.125em;filter:drop-shadow(0 0 .225em rgba(255,255,255,.3))}
.fd-composer-actions .fd-composer-primary [data-primary-icon="send"] path{stroke-width:2.75}
.fd-composer-actions .fd-composer-primary.is-fx [data-primary-icon]:not([data-primary-icon="send"]){opacity:0;transform:scale(.5) rotate(45deg);filter:blur(1px)}
.fd-composer-actions .fd-composer-primary.is-fx [data-primary-icon="send"]{opacity:1;transform:scale(1) rotate(0deg);filter:blur(0)}
.fd-composer .fd-composer-actions .fd-composer-primary.is-launching [data-primary-icon="send"] svg{animation:fd-orb-arrow-fly .6s cubic-bezier(.16,1,.3,1) forwards!important}
.fd-composer .fd-audio-back.is-launching [data-primary-icon="send"] svg{animation:fd-orb-arrow-fly-back .6s cubic-bezier(.16,1,.3,1) forwards!important}
@keyframes fd-orb-arrow-fly{0%{transform:translate(0,0);opacity:1}40%{transform:translate(1.5em,-1.5em);opacity:0}41%{transform:translate(-1.5em,1.5em);opacity:0}100%{transform:translate(.225em,-.225em);opacity:1}}
@keyframes fd-orb-arrow-fly-back{0%{transform:translate(0,0);opacity:1}40%{transform:translate(-1.5em,1.5em);opacity:0}41%{transform:translate(1.5em,-1.5em);opacity:0}100%{transform:translate(-.225em,.225em);opacity:1}}
/* Audio orb: Uiverse Surush0098 "curvy-cat-31" (MIT). Measures are the 74px reference scaled by --fd-cat
   (32/74, or 26/74 in the narrow composer). Light theme matches the reference; dark swaps the pair. */
.fd-composer-actions .fd-composer-primary{--fd-cat:.432432;overflow:visible;background:transparent;box-shadow:none;color:inherit}
.fd-composer-actions .fd-composer-primary:hover:not(:disabled),.fd-app-dark .fd-composer-actions .fd-composer-primary,.fd-app-dark .fd-composer-actions .fd-composer-primary:hover:not(:disabled),.fd-composer.is-recording .fd-composer-primary,.fd-app-dark .fd-composer.is-recording .fd-composer-primary{background:transparent;color:inherit;opacity:1;box-shadow:none;animation:none}
.fd-composer-actions .fd-composer-primary::before,.fd-composer-actions .fd-composer-primary::after{content:none}
.fd-composer-actions .fd-composer-primary:is([data-mode="send"],.is-fx),.fd-composer-actions .fd-composer-primary:is([data-mode="send"],.is-fx)::before,.fd-composer .fd-composer-actions .fd-composer-primary.is-pressing,.fd-composer .fd-composer-actions .fd-composer-primary.is-launching{background:transparent;box-shadow:none}
.fd-composer-actions button.fd-audio-disc{position:absolute;inset:0;z-index:1;box-sizing:border-box;display:block;width:100%;height:100%;margin:0;flex:none;padding:0;border:0;border-radius:50%;background:transparent;box-shadow:none;overflow:visible;color:#171717;transform-origin:center center;-webkit-tap-highlight-color:transparent}
.fd-composer-actions .fd-audio-disc:hover:not(:disabled){background:transparent}
.fd-composer-actions .fd-audio-disc:disabled{background:transparent;opacity:.4}
.fd-composer.is-sending .fd-audio-disc:disabled{opacity:1}
.fd-composer-actions button.fd-audio-back{z-index:1;color:#f4f5f7;pointer-events:none;transform:translateX(0) translateY(0) scale(1) rotate(0);transition:transform .7s cubic-bezier(.23,1,.32,1),opacity .4s!important}
.fd-composer-actions button.fd-audio-front{z-index:2;color:#171717;animation:none!important}
.fd-audio-shell{position:absolute;inset:0;overflow:hidden;border-radius:50%;pointer-events:none}
.fd-audio-shell.is-solid{background:#111;border:1px solid rgba(255,255,255,.1);box-shadow:inset calc(-0.5rem * var(--fd-cat)) calc(-0.5rem * var(--fd-cat)) calc(1rem * var(--fd-cat)) rgba(0,0,0,.9),inset calc(0.375rem * var(--fd-cat)) calc(0.375rem * var(--fd-cat)) calc(0.875rem * var(--fd-cat)) rgba(255,255,255,.15),0 calc(0.125rem * var(--fd-cat)) calc(0.25rem * var(--fd-cat)) rgba(0,0,0,.16)}
.fd-audio-shell.is-solid .fd-audio-sheen{display:none}
.fd-audio-shell.is-glass{border:1px solid rgba(255,255,255,.25);background:transparent;box-shadow:inset 0 1px 1px rgba(255,255,255,.3),inset 0 -1px 0.125rem rgba(0,0,0,.3),0 calc(0.25rem * var(--fd-cat)) calc(0.9375rem * var(--fd-cat)) rgba(0,0,0,.2);backdrop-filter:blur(calc(0.9375rem * var(--fd-cat))) saturate(1.8);-webkit-backdrop-filter:blur(calc(0.9375rem * var(--fd-cat))) saturate(1.8);transition:box-shadow .5s ease-in-out!important}
.fd-composer-primary:hover .fd-audio-shell.is-glass{box-shadow:inset 0 1px 1px rgba(255,255,255,.5),inset 0 calc(-0.125rem * var(--fd-cat)) calc(0.375rem * var(--fd-cat)) rgba(0,0,0,.2),0 calc(0.625rem * var(--fd-cat)) calc(1.875rem * var(--fd-cat)) rgba(255,255,255,.08),0 calc(0.9375rem * var(--fd-cat)) calc(2.1875rem * var(--fd-cat)) rgba(0,0,0,.3)}
.fd-audio-shell .fd-audio-fill{position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.02));transition:background .5s ease!important}
.fd-composer-primary:hover .fd-audio-fill{background:linear-gradient(180deg,rgba(255,255,255,.25),rgba(255,255,255,.05))}
.fd-audio-gloss{position:absolute;top:calc(0.3125rem * var(--fd-cat));left:calc(0.75rem * var(--fd-cat));width:65%;height:25%;border-radius:50%;background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent);filter:blur(calc(0.1875rem * var(--fd-cat)))}
.fd-audio-spot{position:absolute;top:8%;left:10%;width:65%;height:35%;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.35),transparent);transform:rotate(-25deg);filter:blur(calc(1px * var(--fd-cat)))}
.fd-audio-spot.is-low{top:auto;left:auto;bottom:8%;right:10%;width:55%;height:25%;background:linear-gradient(315deg,rgba(255,255,255,.15),transparent)}
.fd-audio-grain{position:absolute;inset:0;opacity:.03;mix-blend-mode:overlay;background-image:radial-gradient(#fff 1px,transparent 1px);background-size:0.1875rem 0.1875rem}
.fd-audio-sheen{position:absolute;inset:-50%;background:linear-gradient(130deg,transparent 40%,rgba(255,255,255,.5) 50%,transparent 60%);transform:translateX(-150%) rotate(25deg);transition:transform 1s cubic-bezier(.23,1,.32,1)!important;pointer-events:none}
.fd-composer-primary:hover .fd-audio-front .fd-audio-sheen{transform:translateX(150%) rotate(25deg)}
.fd-audio-front .fd-composer-primary-icons svg{filter:drop-shadow(0 calc(0.25rem * var(--fd-cat)) calc(0.5rem * var(--fd-cat)) rgba(0,0,0,.3));transition:transform .5s cubic-bezier(.23,1,.32,1),filter .5s cubic-bezier(.23,1,.32,1)!important}
.fd-composer-primary:hover .fd-audio-front .fd-composer-primary-icons svg{transform:scale(1.05) translateY(calc(-0.125rem * var(--fd-cat)));filter:drop-shadow(0 calc(0.5rem * var(--fd-cat)) calc(0.9375rem * var(--fd-cat)) rgba(0,0,0,.5))}
.fd-audio-front:active .fd-composer-primary-icons svg{transform:scale(.98)}
.fd-composer .fd-audio-back [data-primary-icon="send"]{opacity:1!important;transform:scale(1) rotate(0deg)!important;filter:none!important}
.fd-composer-primary.is-split .fd-audio-back{pointer-events:auto;transform:translateX(calc(4.0625rem * var(--fd-cat))) translateY(0) scale(.97) rotate(180deg)}
.fd-composer-primary.is-split .fd-audio-back .fd-composer-primary-icons{transform:rotate(-180deg);transition:transform .7s cubic-bezier(.23,1,.32,1)!important}
.fd-composer-primary.is-split .fd-audio-back:active,.fd-composer.is-sending .fd-composer-primary.is-split .fd-audio-back{transform:translateX(calc(4.0625rem * var(--fd-cat))) translateY(0) scale(.97) rotate(180deg)}
.fd-composer-primary.is-split .fd-audio-back:active .fd-composer-primary-icons,.fd-composer.is-sending .fd-composer-primary.is-split .fd-audio-back .fd-composer-primary-icons{transform:rotate(-180deg)}
.fd-composer-primary[data-mode="send"] .fd-audio-back,.fd-composer-primary.is-fx:not(.is-split) .fd-audio-back{pointer-events:auto;opacity:1}
.fd-composer-primary[data-mode="send"] .fd-audio-front,.fd-composer-primary.is-fx:not(.is-split) .fd-audio-front{opacity:0!important;pointer-events:none}
.fd-composer-primary:not(.is-split):not([data-mode="send"]):not(.is-fx) .fd-audio-back{opacity:0}
.fd-app-dark .fd-audio-front{color:#f4f4f5}
.fd-app-dark .fd-audio-shell.is-glass{background:rgba(20,20,22,.45);border-color:rgba(255,255,255,.25)}
.fd-app-dark .fd-audio-shell .fd-audio-fill{background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.02))}
.fd-app-dark .fd-composer-primary:hover .fd-audio-fill{background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.05))}
.fd-app-dark .fd-audio-shell.is-solid{background:linear-gradient(180deg,#f7f7f8,#d9dadd);border-color:rgba(255,255,255,.45);box-shadow:inset calc(-0.5rem * var(--fd-cat)) calc(-0.5rem * var(--fd-cat)) calc(1rem * var(--fd-cat)) rgba(0,0,0,.18),inset calc(0.375rem * var(--fd-cat)) calc(0.375rem * var(--fd-cat)) calc(0.875rem * var(--fd-cat)) rgba(255,255,255,.85),0 calc(0.125rem * var(--fd-cat)) calc(0.25rem * var(--fd-cat)) rgba(0,0,0,.12)}
.fd-app-dark .fd-composer-actions button.fd-audio-back{color:#171717}
.fd-composer-actions button.fd-audio-back:hover:not(:disabled){background:transparent;color:#f4f5f7}
.fd-composer-actions button.fd-audio-back:hover:not(:disabled) [data-primary-icon="send"] svg{filter:drop-shadow(0 0 .32em rgba(255,255,255,.75))}
.fd-app-dark .fd-composer-actions button.fd-audio-back:hover:not(:disabled){background:transparent;color:#171717}
.fd-app-dark .fd-composer-actions button.fd-audio-back:hover:not(:disabled) [data-primary-icon="send"] svg{filter:none}
.fd-audio-rec{display:block;width:0.5rem;height:0.5rem;border-radius:50%;background:#e23b3b;box-shadow:none;animation:none}
.fd-composer.is-recording .fd-audio-front [data-primary-icon="pause"] svg{color:#e23b3b;animation:none!important}
.fd-composer.is-split:not(.is-recording) .fd-audio-rec{animation:fd-audio-rec 1.7s ease-in-out infinite!important}
@keyframes fd-audio-rec{0%,100%{box-shadow:0 0 0 0 rgba(226,59,59,.45);transform:scale(1)}50%{box-shadow:0 0 0 0.1875rem rgba(226,59,59,0);transform:scale(1.04)}}
.fd-audio-player{display:flex;align-items:center;gap:0.5rem;width:min(17.5rem,100%);margin-top:0.5rem;padding:0.3125rem 0.625rem 0.3125rem 0.3125rem;box-sizing:border-box;border:1px solid #ffffff70;border-radius:62.4375rem;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.16));box-shadow:inset 0 1px 1px #ffffff80}
.fd-audio-toggle{position:relative;flex:0 0 1.75rem;width:1.75rem;height:1.75rem;padding:0;border:0;border-radius:50%;background:#111;color:#fafafa;box-shadow:inset -0.125rem -0.125rem 0.25rem rgba(0,0,0,.75),inset 1px 1px 0.1875rem rgba(255,255,255,.18),0 0.125rem 0.25rem rgba(0,0,0,.16);cursor:pointer}
.fd-audio-toggle-icon{position:absolute;inset:0;margin:auto;width:0.5625rem;height:0.5625rem;opacity:0}
.fd-audio-toggle-icon[data-audio-icon="play"]{opacity:1;background:currentColor;clip-path:polygon(18% 8%,18% 92%,90% 50%)}
.fd-audio-player.is-playing .fd-audio-toggle-icon[data-audio-icon="play"]{opacity:0}
.fd-audio-player.is-playing .fd-audio-toggle-icon[data-audio-icon="pause"]{opacity:1;background:linear-gradient(currentColor,currentColor) 0 0/0.15625rem 100% no-repeat,linear-gradient(currentColor,currentColor) 100% 0/0.15625rem 100% no-repeat}
.fd-audio-track{position:relative;flex:1;height:0.25rem;border-radius:6.1875rem;background:#88888828;cursor:pointer}
.fd-audio-progress{position:absolute;left:0;top:0;bottom:0;height:100%;width:0;max-width:100%;border-radius:inherit;background:#171717;pointer-events:none}
.fd-audio-time{flex:0 0 auto;color:#85868c;font-size:0.625rem;font-variant-numeric:tabular-nums}
.fd-audio-player audio{position:absolute;width:0;height:0;opacity:0;pointer-events:none}
.fd-app-dark .fd-audio-player{border-color:#ffffff18;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));box-shadow:inset 0 1px 1px #ffffff10}
.fd-app-dark .fd-audio-toggle{background:linear-gradient(180deg,#f7f7f8,#d9dadd);color:#171717}
.fd-app-dark .fd-audio-progress{background:#f4f4f5}
.fd-app-dark .fd-audio-track{background:#ffffff18}
@container(max-width:220px){.fd-composer-actions .fd-composer-primary{--fd-cat:.351351;flex-basis:1.625rem;width:1.625rem;height:1.625rem}}
/* Mood row: Uiverse fahad_3872 "rotten-octopus-10" (MIT), with avatars at the 30px emotion-button size. */
.fd-mood-block{--fd-mood-face:#f1f5f9;--fd-mood-ring:#fff;display:flex;flex-direction:column;align-items:center;gap:0.5rem;margin:0 0 0.625rem;text-align:center}
.fd-mood-title{margin:0;color:#1e293b;font-size:0.9375rem;font-weight:700;line-height:1.2}
.fd-mood-bar{display:block;width:calc(7 * 1.875rem + 6 * 0.5rem + 3rem);max-width:100%;margin-inline:auto;box-sizing:border-box;padding:1rem 1.5rem;overflow-x:clip;overflow-y:visible;cursor:grab;touch-action:none;user-select:none;background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.6);border-radius:3.75rem;box-shadow:0 0.25rem 0.375rem -1px rgba(0,0,0,.05),0 0.625rem 0.9375rem -0.1875rem rgba(0,0,0,.05),0 0 0 1px rgba(0,0,0,.02);backdrop-filter:blur(1.25rem);-webkit-backdrop-filter:blur(1.25rem)}
.fd-mood-bar.is-grabbing,.fd-mood-bar.is-grabbing .fd-mood-btn{cursor:grabbing}
.fd-mood-track{display:flex;flex-wrap:nowrap;align-items:center;gap:0.5rem;width:max-content}
.fd-mood-item{position:relative;display:flex;flex:none;justify-content:center;align-items:center}
/* !important keeps the requested motion even when the OS reduced-motion rule above disables composer transitions. */
.fd-composer-emotion .fd-mood-btn{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:1.875rem;height:1.875rem;min-height:0;padding:0;border:0.1875rem solid var(--fd-mood-ring);border-radius:50%;background-color:var(--fd-mood-face);cursor:pointer;overflow:hidden;box-shadow:0 0.25rem 0.375rem rgba(0,0,0,.05);transition:all .4s cubic-bezier(.34,1.56,.64,1)!important}
.fd-composer-emotion .fd-mood-btn:hover{background-color:var(--fd-mood-face)}
.fd-composer-emotion .fd-mood-btn svg{display:block;width:100%;height:100%}
.fd-composer-emotion .fd-mood-tooltip{position:absolute;top:-3rem;z-index:0;padding:0.375rem 0.75rem;border-radius:0.5rem;background-color:#1e293b;color:#fff;font-size:0.6875rem;font-weight:700;line-height:normal;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap;opacity:0;pointer-events:none;transform:translateY(0.625rem) scale(.9);box-shadow:0 0.25rem 0.375rem -1px rgba(0,0,0,.1);transition:all .2s ease-out!important}
.fd-mood-tooltip::after{content:"";position:absolute;bottom:-0.25rem;left:50%;transform:translateX(-50%);width:0;height:0;border-left:0.3125rem solid transparent;border-right:0.3125rem solid transparent;border-top:0.3125rem solid #1e293b}
.fd-composer-emotion :is(.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-btn{z-index:10;transform:scale(1.5) translateY(-0.625rem);border-color:var(--fd-mood-ring);box-shadow:0 1.25rem 1.5625rem -0.3125rem rgba(0,0,0,.1),0 0.5rem 0.625rem -0.375rem rgba(0,0,0,.1)}
.fd-composer-emotion :is(.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-tooltip{z-index:20;opacity:1;transform:translateY(0) scale(1);transition-delay:.1s!important}
.fd-composer-emotion .fd-mood-bar:hover .fd-mood-item:not(:hover) .fd-mood-btn{filter:grayscale(20%) opacity(.7);transform:scale(.95)}
.fd-composer-emotion .fd-mood-item .fd-mood-btn[aria-pressed="true"]{border-color:#4179b0}
.fd-composer-emotion .fd-mood-btn:focus-visible{outline:0.125rem solid #78b9ff;outline-offset:0.125rem}
@container(max-width:340px){.fd-mood-bar{padding-inline:0.625rem;width:calc(7 * 1.875rem + 6 * 0.25rem + 1.25rem)}.fd-mood-track{gap:0.25rem}}
.fd-app-dark .fd-mood-block{--fd-mood-face:#ffffff12;--fd-mood-ring:#ffffff38}
.fd-app-dark .fd-mood-title{color:#dedee3}
.fd-app-dark .fd-mood-bar{background:#ffffff0d;border-color:#ffffff1f;box-shadow:inset 0 1px 1px #ffffff12,0 0.625rem 0.9375rem -0.1875rem #0000001f}
.fd-app-dark .fd-composer-emotion .fd-mood-item .fd-mood-btn[aria-pressed="true"]{border-color:#a6c7e4}
/* Mood skins on the composer button blink like the default face. */
.fd-mood-eye{transform-box:fill-box;transform-origin:center}
.is-blinking .fd-mood-eye{transform:scaleY(.08)}
/* Every face blinks the same way, reduced motion included: the lid drops fast without overshoot and reopens with a 4% pop. */
.fd-composer :is(.fd-emotion-eye,.fd-mood-eye){transition:transform .16s cubic-bezier(.3,1.35,.5,1)!important}
.fd-composer .is-blinking :is(.fd-emotion-eye,.fd-mood-eye){transition:transform .07s cubic-bezier(.55,0,1,.45)!important}
/* Mood reactions: on the composer button (hover, focus, picker open) and on the hovered mood in the picker.
   The outgoing set fades in 100ms and the incoming one starts 60ms later, so the two expressions never ghost on top of each other. */
.fd-composer :is(.fd-mood-rest,.fd-mood-react){transform-box:fill-box;transform-origin:center}
.fd-composer .fd-mood-rest{transition:opacity .16s ease .06s,transform .3s cubic-bezier(.34,1.56,.64,1) .04s!important}
.fd-composer .fd-mood-react{transition:opacity .1s ease,transform .18s ease-in!important}
.fd-composer .fd-mood-eye.fd-mood-rest{transition:opacity .16s ease .06s,transform .16s cubic-bezier(.3,1.35,.5,1)!important}
.fd-composer .is-blinking .fd-mood-eye.fd-mood-rest{transition:opacity .16s ease .06s,transform .07s cubic-bezier(.55,0,1,.45)!important}
/* Held click: the shut lids widen and flatten further, with a faint strain tremble, until the button is released. */
.fd-composer .is-squeezing :is(.fd-emotion-eye,.fd-mood-eye){transform:scale(1.22,.06);transition:transform .14s cubic-bezier(.3,1.4,.5,1)!important;animation:fd-eye-squeeze .45s ease-in-out .14s infinite alternate both!important}
.fd-composer .is-squeezing .fd-mood-eye.fd-mood-rest{transition:opacity .16s ease .06s,transform .14s cubic-bezier(.3,1.4,.5,1)!important}
@keyframes fd-eye-squeeze{from{transform:scale(1.22,.06)}to{transform:scale(1.3,.045)}}
/* Held click shows > < shut eyes: the open eyes (rest, reaction or Feliz's arcs) hide and the chevrons pop in with a strain tremble; hair still covers them. */
.fd-mood-squint,.fd-emotion-squint{opacity:0;pointer-events:none}
:is(.fd-mood-squint,.fd-emotion-squint) path{fill:none;stroke-linecap:round;stroke-linejoin:round;transform-box:fill-box;transform-origin:center;transform:scale(.4)}
.fd-composer .is-squeezing :is(.fd-emotion-eye,.fd-mood-eye,.fd-mood-eye-arc){opacity:0!important;transition:opacity .06s ease!important}
.fd-composer .is-squeezing :is(.fd-mood-squint,.fd-emotion-squint){opacity:1;transition:opacity .08s ease!important}
.fd-composer .is-squeezing :is(.fd-mood-squint,.fd-emotion-squint) path{transform:none;transition:transform .2s cubic-bezier(.34,1.56,.64,1)!important;animation:fd-squint-strain .45s ease-in-out .2s infinite alternate both!important}
@keyframes fd-squint-strain{from{transform:none}to{transform:scale(1.08,.86)}}
.fd-mood-react{opacity:0;transform:scale(.4)}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-rest{opacity:0;transform:scaleY(.3);transition:opacity .1s ease,transform .18s ease-in!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-react{opacity:1;transform:none;transition:opacity .16s ease .06s,transform .3s cubic-bezier(.34,1.56,.64,1) .04s!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-cheek{opacity:.75}
/* Expression accents (in 64-unit artwork space): they play with the reaction, reduced motion included, like the hair and the blink. */
.fd-composer [class*="fd-mood-fx-"]{transform-box:fill-box;transform-origin:center}
.fd-composer .fd-mood-fx-tear{opacity:0}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-giggle{animation:fd-mood-giggle .6s cubic-bezier(.3,.7,.4,1) .12s 2 both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-glance{animation:fd-mood-glance 2.6s ease-in-out .35s infinite both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-spin{animation:fd-mood-spin 1s ease-in-out infinite alternate both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-shine{animation:fd-mood-shine 1.1s ease-in-out .2s infinite alternate both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-twinkle{animation:fd-mood-twinkle 1.3s ease-in-out var(--fd-fx-delay,0s) infinite both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-brow{animation:fd-mood-brow .55s cubic-bezier(.3,1.5,.5,1) .04s both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-gasp{animation:fd-mood-gasp .5s cubic-bezier(.3,1.5,.5,1) .06s both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-tear{animation:fd-mood-tear 1.8s ease-in .3s infinite both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-quiver{animation:fd-mood-quiver .28s ease-in-out infinite alternate both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-shake{animation:fd-mood-shake .45s ease-in-out .06s 2 both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-fx-pulse{animation:fd-mood-pulse .8s ease-in-out infinite both!important}
@keyframes fd-mood-giggle{0%,100%{transform:translateY(0)}35%{transform:translateY(-1.8px)}70%{transform:translateY(.4px)}}
@keyframes fd-mood-glance{0%,20%,100%{transform:translateX(0)}35%,55%{transform:translateX(1.8px)}70%,85%{transform:translateX(-1.2px)}}
@keyframes fd-mood-spin{from{transform:rotate(-10deg) scale(1)}to{transform:rotate(10deg) scale(1.06)}}
@keyframes fd-mood-shine{from{transform:scale(.85);opacity:.85}to{transform:scale(1.12);opacity:1}}
@keyframes fd-mood-twinkle{0%,100%{opacity:0;transform:scale(.2) rotate(0)}50%{opacity:1;transform:scale(1) rotate(45deg)}}
@keyframes fd-mood-brow{0%{transform:translateY(0.15rem)}55%{transform:translateY(-1.4px)}100%{transform:translateY(0)}}
@keyframes fd-mood-gasp{0%{transform:scale(.7)}55%{transform:scale(1.14)}100%{transform:scale(1)}}
@keyframes fd-mood-tear{0%{opacity:0;transform:translateY(0) scale(.6)}15%{opacity:1;transform:translateY(0) scale(1)}80%{opacity:1}100%{opacity:0;transform:translateY(0.5625rem) scale(.9)}}
@keyframes fd-mood-quiver{from{transform:translateY(0) scaleX(1)}to{transform:translateY(.5px) scaleX(.96)}}
@keyframes fd-mood-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-0.1375rem)}40%{transform:translateX(0.125rem)}60%{transform:translateX(-1.4px)}80%{transform:translateX(.8px)}}
@keyframes fd-mood-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.28)}}
/* Spontaneous act: each face plays one short motion of its mood as the reaction lands, like Bravo's shake (the reference). Triste keeps its drooped end pose while hovered. */
.fd-composer .fd-mood-act{transform-box:fill-box;transform-origin:50% 60%}
.fd-composer .fd-mood-act[data-act="empolgado"]{transform-origin:50% 100%}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-act[data-act="feliz"]{animation:fd-act-feliz .95s ease-in-out .14s both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-act[data-act="neutro"]{animation:fd-act-neutro 1.3s ease-in-out .35s both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-act[data-act="empolgado"]{animation:fd-act-empolgado .9s ease-in-out .1s both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-act[data-act="surpreso"]{animation:fd-act-surpreso .7s ease-out .02s both!important}
:is(.fd-composer-emotion-button:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled),.fd-mood-item:hover,.fd-mood-item:has(:focus-visible)) .fd-mood-act[data-act="triste"]{animation:fd-act-triste 1.6s ease-in-out .2s both!important}
@keyframes fd-act-feliz{0%,100%{transform:none}18%{transform:translateY(-1.6px) rotate(-5deg)}36%{transform:translateY(.3px) rotate(0)}56%{transform:translateY(-1.2px) rotate(4deg)}76%{transform:translateY(.2px) rotate(0)}}
@keyframes fd-act-neutro{0%,100%{transform:none}25%,62%{transform:translateX(-.8px) rotate(-6deg)}80%{transform:rotate(1deg)}}
@keyframes fd-act-empolgado{0%,86%,100%{transform:none}10%{transform:scale(1.07,.9)}26%{transform:translateY(-0.2rem) scale(.94,1.08)}42%{transform:scale(1.06,.92)}57%{transform:translateY(-0.125rem) scale(.96,1.05)}72%{transform:scale(1.03,.96)}}
@keyframes fd-act-surpreso{0%,100%{transform:none}14%{transform:translateY(-0.1625rem) scale(1.09)}34%{transform:translateY(.8px) scale(.96)}52%{transform:translateY(-.8px) scale(1.03)}72%{transform:translateY(.2px) scale(.99)}}
@keyframes fd-act-triste{0%{transform:none}38%,56%{transform:translateY(0.125rem) rotate(3deg) scaleY(.97)}66%{transform:translateY(.8px) rotate(2deg)}78%{transform:translateY(1.6px) rotate(2.5deg) scaleY(.98)}100%{transform:translateY(1.3px) rotate(2deg)}}
/* Smooth curves at 24-30px, and the hair spring never shows past the head on the composer button. */
.fd-mood-face{shape-rendering:geometricPrecision}
.fd-composer-actions button.fd-composer-emotion-button svg.fd-mood-face{clip-path:circle(50%)}
.fd-composer:has(.fd-mood-ghost) .fd-composer-card,
.fd-composer:has(.fd-mood-ghost) .fd-composer-actions,
.fd-composer-dock:has(.fd-mood-ghost){overflow:visible}
.fd-call-text-card:has(.fd-mood-ghost){overflow:visible}
.fd-call-main-card:has(.fd-mood-ghost){overflow-x:clip;overflow-y:visible}
.fd-composer-emotion .fd-mood-btn:has(.fd-mood-ghost),
.fd-composer-actions button.fd-composer-emotion-button:has(.fd-mood-ghost){position:relative;z-index:6;overflow:visible;background:#040405}
.fd-mood-ghost{position:absolute;z-index:6;inset:0;overflow:visible;pointer-events:none}
.fd-mood-ghost-canvas{position:absolute;z-index:6;left:0;top:0;display:block;pointer-events:none;filter:blur(.35px)}
.fd-mood-item:is(:hover,:has(:focus-visible)) .fd-emotion-sad{opacity:0;transform:scaleY(-.4)}
.fd-mood-item:is(:hover,:has(:focus-visible)) .fd-emotion-happy{opacity:1;transform:none}
.fd-composer .fd-emotion-sad{transition:opacity .18s ease,transform .25s cubic-bezier(.34,1.56,.64,1)!important}
.fd-composer .fd-emotion-happy{transition:opacity .18s ease,transform .28s cubic-bezier(.34,1.56,.64,1)!important}
/* Gaze layers (features and hair) turn and narrow around the face centre, in SVG user units. */
.fd-emotion-look,.fd-mood-hair{transform-box:view-box;transform-origin:50% 50%}