main:has(.chat){flex-direction:column;display:flex;overflow:hidden}.chat{flex-direction:column;flex:1;min-height:0;display:flex}.chat .log{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;flex:1;min-height:0;padding:32px 20px 16px;overflow-y:auto}.chat.landing{justify-content:center}.chat.landing .log{flex:none;padding-bottom:12px;overflow:visible}.chat .thread{flex-direction:column;gap:28px;max-width:760px;margin:0 auto;display:flex}.chat .msg{gap:14px;display:flex}.chat .msg.me{justify-content:flex-end}.chat .avatar{background:var(--red);color:#fff;border-radius:50%;flex:none;place-items:center;width:30px;height:30px;margin-top:2px;font-size:.8rem;font-weight:700;display:grid}.chat .bubble{min-width:0}.chat .msg.bot .bubble{flex:1}.chat .msg.me .bubble{background:var(--red-tint);max-width:80%;color:var(--ink);border-radius:22px 22px 6px;padding:.6rem 1.1rem}.chat .bubble h1{margin:0 0 .3em;font-size:clamp(1.7rem,4.5vw,2.4rem)}.chat .bubble h2{margin:0 0 .7em;font-size:1.05rem}.chat .bubble p{margin:0 0 .7em}.chat .bubble>:last-child{margin-bottom:0}.chat .bubble .lead{font-size:1.1rem}.chat .flash .bubble{animation:1.2s flash}@keyframes flash{0%,60%{background:var(--red-tint);box-shadow:0 0 0 8px var(--red-tint);border-radius:12px}to{box-shadow:none;background:0 0}}.chat .typing span{background:var(--red);border-radius:50%;width:7px;height:7px;margin:8px 3px 0 0;animation:1s infinite blink;display:inline-block}.chat .typing span:nth-child(2){animation-delay:.2s}.chat .typing span:nth-child(3){animation-delay:.4s}.chat .tw-hide{display:none!important}.chat .tw-caret{vertical-align:-.15em;background:var(--red);width:2px;height:1.05em;margin-left:2px;animation:.8s step-end infinite caret;display:inline-block}@keyframes caret{50%{opacity:0}}@keyframes blink{0%,60%,to{opacity:.2}30%{opacity:1}}@media (prefers-reduced-motion:reduce){.chat .log{scroll-behavior:auto}.chat .typing span,.chat .flash .bubble,.chat .input-wrap,.chat .tw-caret{animation:none}}.chat .composer{flex:none;width:100%;max-width:780px;margin:0 auto;padding:8px 20px 4px;position:relative}@property --angle{syntax:"<angle>";inherits:false;initial-value:0deg}.chat .input-wrap{--rainbow:conic-gradient(from var(--angle), #ff3b30, #ff9500, #ffd60a, #34c759, #00c7be, #0a84ff, #bf5af2, #ff2d92, #ff3b30);animation:5s linear infinite spin;position:relative}.chat .input-wrap:before{content:"";background:var(--rainbow);filter:blur(14px);opacity:.35;border-radius:999px;transition:opacity .2s;position:absolute;inset:2px}.chat .input-wrap:hover:before,.chat .input-wrap:has([aria-expanded=true]):before{opacity:.6}.chat .input-wrap:has([aria-expanded=true]){animation-duration:2.5s}@keyframes spin{to{--angle:360deg}}.chat .input{width:100%;font:inherit;text-align:left;color:var(--muted);cursor:text;background:linear-gradient(var(--surface), var(--surface)) padding-box, var(--rainbow) border-box;border:2px solid #0000;border-radius:999px;justify-content:space-between;align-items:center;gap:12px;padding:13px 13px 13px 22px;display:flex;position:relative}.chat .input:focus-visible{outline:2px solid var(--red);outline-offset:3px}.chat .caret{background:var(--red);color:#fff;border-radius:50%;place-items:center;width:32px;height:32px;font-size:.7rem;transition:transform .2s;display:grid}.chat .input[aria-expanded=true] .caret{transform:rotate(180deg)}.chat .menu{background:var(--surface);border:1px solid var(--line);max-height:min(60vh,440px);box-shadow:var(--shadow);z-index:5;border-radius:20px;padding:8px;position:absolute;bottom:calc(100% - 2px);left:20px;right:20px;overflow-y:auto}.chat .menu[hidden]{display:none}.chat .menu button{width:100%;font:inherit;text-align:left;color:var(--ink);cursor:pointer;background:0 0;border:0;border-radius:12px;padding:.6rem .9rem;display:block}.chat .menu button:hover,.chat .menu button:focus-visible{background:var(--red-tint);color:var(--red);outline:0}.chat .menu button[data-done]:after{content:" ✓";color:var(--muted)}@media (width<=600px){.chat .log{padding:20px 14px 10px}.chat .composer{padding:8px 12px 2px}.chat .menu{left:12px;right:12px}.chat .msg{gap:10px}}
