/* "Start a conversation" button: on hover it shows "typing…" dots, then types its label with a caret, like a chat. */
body[data-section=home] .dialogue-anthe{--typing-color:color-mix(in srgb,rgb(var(--button-rgb)) 45%,#fff)}
body[data-section=home] :is(.dialogue-anthe-text,.dialogue-anthe-typed,.dialogue-anthe-dots){font-style:normal}
body[data-section=home] .dialogue-anthe-text{transition:color .15s}
body[data-section=home] .dialogue-anthe:is(.is-thinking,.is-typing) .dialogue-anthe-text{color:transparent}
body[data-section=home] .dialogue-anthe-typed{position:absolute;left:0;top:0;white-space:nowrap;pointer-events:none}
body[data-section=home] .dialogue-anthe.is-typing .dialogue-anthe-typed::after{content:"";display:inline-block;width:1.5px;height:1.05em;margin-left:3px;vertical-align:-.15em;background:var(--typing-color);animation:dialogue-caret .8s steps(1) infinite}
body[data-section=home] .dialogue-anthe-dots{position:absolute;left:50%;top:50%;display:flex;gap:6px;transform:translate(-50%,-50%);opacity:0;transition:opacity .2s;pointer-events:none}
body[data-section=home] .dialogue-anthe.is-thinking .dialogue-anthe-dots{opacity:1}
body[data-section=home] .dialogue-anthe-dots i{width:5px;height:5px;border-radius:50%;background:var(--typing-color);animation:dialogue-dot 1s ease-in-out infinite}
body[data-section=home] .dialogue-anthe-dots i:nth-child(2){animation-delay:.15s}
body[data-section=home] .dialogue-anthe-dots i:nth-child(3){animation-delay:.3s}
body[data-section=home] .dialogue-anthe:is(.is-thinking,.is-typing) .dialogue-anthe-outline{stroke:rgb(var(--button-rgb));filter:drop-shadow(0 0 6px rgba(var(--button-rgb),.65))}
@keyframes dialogue-dot{0%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@keyframes dialogue-caret{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){body[data-section=home] .dialogue-anthe-dots i,body[data-section=home] .dialogue-anthe.is-typing .dialogue-anthe-typed::after{animation:none}}
