/* Finishing rules shared by the studio and the website canvas. */
:root{--ml-lime:#d2f86a;--ml-focus:#e8cc91}
body{font-optical-sizing:auto;text-rendering:optimizeLegibility}
h1,h2,h3{text-wrap:balance}p{ text-wrap:pretty }
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
:where(button,a,input,textarea,select,summary):focus-visible{outline:2px solid var(--ml-focus);outline-offset:4px}
.typing-assist{grid-column:1/-1;flex-basis:100%;display:flex;align-items:center;flex-wrap:wrap;gap:8px;width:100%;padding:8px 0;font:11px/1.5 var(--sans);color:#b8bfae}
.typing-assist[hidden]{display:none!important}.typing-choices{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.typing-assist button{min-height:34px;padding:5px 10px;border:1px solid #d2f86a30;border-radius:8px;background:#d2f86a0b;color:#e5eed8;font:11px var(--sans);cursor:pointer}
.typing-assist button:hover{background:#d2f86a22}.typing-assist button:last-child{color:#aeb7a5;border-color:transparent;background:transparent}
.content-studio[data-view="studio"] .cmp-row:has(.typing-assist){display:grid;grid-template-columns:minmax(0,1fr) auto}
.cmp-row .cmp-input{grid-row:1;grid-column:1;min-width:0}
.cmp-row .send{grid-row:1;grid-column:2}
.cmp-row .typing-assist{grid-row:2;grid-column:1/-1;min-width:0;flex-basis:auto}
.website-start-form .typing-assist{font-size:11px}.start-story:has(.typing-assist){gap:6px}
.ml-quiet-link{font:12px var(--sans);color:#c3cabc;min-height:40px;display:inline-flex;align-items:center;padding:6px 10px;border-radius:8px;text-decoration:none}
.ml-quiet-link:hover{background:#ffffff09;color:#e5efda}
@media(max-width:600px){.typing-assist button{min-height:40px}.typing-assist{font-size:12px}.ml-quiet-link{min-height:44px}}
@media(max-width:600px){.content-studio[data-view="studio"] .cmp-row:has(.typing-assist){grid-template-columns:minmax(0,1fr)}.cmp-row .send{grid-column:1;grid-row:3;justify-self:end}}
@media(prefers-reduced-motion:no-preference){.btn,.send,.welcome-start,.member-button{transition:background-color .18s,color .18s,border-color .18s,box-shadow .18s}.btn:active,.send:active,.welcome-start:active{translate:0 1px}}
@media(max-width:760px){.ml-xnav{flex-wrap:wrap;max-width:100%;gap:4px 8px}}
.website-start-form > .typing-assist { grid-column: 1 / -1; }