.say-name{vertical-align:middle;align-items:center;gap:4px;max-width:100%;display:inline-flex}.say-name__btn{width:44px;height:44px;color:var(--text-2);transition:transform var(--dur-press) var(--ease-out), color var(--dur-1) var(--ease-out), background-color var(--dur-1) var(--ease-out);background:0 0;border:0;border-radius:50%;flex:none;place-items:center;padding:0;display:inline-grid;position:relative}.say-name__btn:focus-visible{outline:2px solid var(--focus);outline-offset:0}@media (hover:hover) and (pointer:fine){.say-name__btn:hover{color:var(--text);background:color-mix(in srgb, var(--text) 8%, transparent)}}.say-name__btn.is-playing{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent)}.say-name__ico{place-items:center;display:grid;position:relative}.say-name__ico i{opacity:0;background:currentColor;border-radius:1px;width:2px;height:10px;margin-top:-5px;position:absolute;top:50%;left:calc(100% + 1px);transform:scaleY(.3)}.say-name__ico i:nth-of-type(2){left:calc(100% + 5px)}.say-name__ico i:nth-of-type(3){left:calc(100% + 9px)}.is-playing .say-name__ico i{opacity:.9;animation:say-bar .55s var(--ease-in-out) infinite alternate}.is-playing .say-name__ico i:nth-of-type(2){animation-delay:90ms}.is-playing .say-name__ico i:nth-of-type(3){animation-delay:.18s}@keyframes say-bar{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}:root[data-motion=reduce] .is-playing .say-name__ico i{transform:scaleY(.7)}@media (prefers-reduced-motion:reduce){:root:not([data-motion=full]) .is-playing .say-name__ico i{transform:scaleY(.7)}}.say-name__r{font-family:var(--font-display);font-size:var(--t-small);line-height:var(--lh-small);letter-spacing:.04em;color:var(--text-2);overflow-wrap:anywhere;min-width:0}.say-name--icon .say-name__btn{background:color-mix(in srgb, var(--bg) 70%, transparent);border:1px solid var(--line-soft);width:32px;height:32px}.say-name--icon .say-name__btn.is-playing{border-color:var(--accent)}@media (pointer:coarse){.say-name--icon .say-name__btn{width:44px;height:44px}}
