@import"https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Poppins:wght@500;600;700&display=swap";:root{--ink: #14152b;--slate: #4b5563;--muted: #8890a0;--blue: #2563eb;--coral: #fa4954;--paper: #ffffff;--mist: #f5f7fb;--line: #e6e9f0}.page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem 1.5rem;background:radial-gradient(60rem 40rem at 85% -10%,#eaf1ff 0%,transparent 55%),radial-gradient(50rem 40rem at -10% 110%,#fff0f1 0%,transparent 50%),var(--paper);font-family:Lato,system-ui,sans-serif;color:var(--slate);-webkit-font-smoothing:antialiased}.grid{width:100%;max-width:62rem;display:grid;grid-template-columns:1.05fr .95fr;gap:3.5rem;align-items:center}.logo{display:block;height:2.1rem;width:auto}.eyebrow{margin:2rem 0 .9rem;font-family:Poppins,sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--blue)}.heading{margin:0;font-family:Poppins,sans-serif;font-weight:700;font-size:clamp(2.1rem,5vw,3rem);line-height:1.06;letter-spacing:-.02em;color:var(--ink)}.heading em{font-style:normal;color:var(--coral)}.lede{margin:1.1rem 0 0;max-width:30rem;font-size:1.075rem;line-height:1.6;color:var(--slate)}.form{margin-top:2rem}.field{display:block;max-width:30rem}.fieldLabel{display:block;margin-bottom:.5rem;font-family:Poppins,sans-serif;font-weight:600;font-size:.82rem;color:var(--ink)}.inputRow{display:flex;gap:.5rem;padding:.35rem;background:var(--paper);border:1px solid var(--line);border-radius:.85rem;box-shadow:0 1px 2px #14152b0a;transition:border-color .15s ease,box-shadow .15s ease}.inputRow:focus-within{border-color:var(--blue);box-shadow:0 0 0 4px #2563eb1f}.input{flex:1;min-width:0;border:0;outline:none;padding:.7rem .75rem;font-family:Lato,sans-serif;font-size:1rem;color:var(--ink);background:transparent}.input::placeholder{color:var(--muted)}.button{flex-shrink:0;border:0;cursor:pointer;padding:0 1.4rem;border-radius:.6rem;background:var(--blue);color:#fff;font-family:Poppins,sans-serif;font-weight:600;font-size:.95rem;transition:background .15s ease,transform .05s ease}.button:hover{background:#1d4ed8}.button:active{transform:translateY(1px)}.hint{display:block;margin-top:.65rem;font-size:.85rem;color:var(--muted)}.notice{margin-top:2rem;padding:.9rem 1.1rem;border:1px solid var(--line);border-radius:.75rem;background:var(--mist);font-size:.95rem;color:var(--slate)}.pills{list-style:none;margin:2rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}.pills>li{padding:.4rem .85rem;border-radius:999px;background:var(--mist);border:1px solid var(--line);font-size:.83rem;font-weight:700;color:var(--slate)}.demo{display:flex;justify-content:center}.widget{width:100%;max-width:22rem;background:var(--paper);border:1px solid var(--line);border-radius:1.25rem;box-shadow:0 24px 60px -24px #14152b47;overflow:hidden;animation:float 6s ease-in-out infinite}.widgetHead{display:flex;align-items:center;gap:.65rem;padding:1rem 1.15rem;border-bottom:1px solid var(--line)}.avatar{width:1.65rem;height:1.65rem;border-radius:.5rem;flex-shrink:0}.widgetWho{display:flex;flex-direction:column;line-height:1.3}.widgetWho strong{font-family:Poppins,sans-serif;font-size:.92rem;color:var(--ink)}.status{display:flex;align-items:center;gap:.4rem;font-size:.74rem;color:var(--muted)}.dot{width:.5rem;height:.5rem;border-radius:50%;background:#16b364;box-shadow:0 0 #16b36480;animation:pulse 2.2s ease-out infinite}.thread{padding:1.15rem;display:flex;flex-direction:column;gap:.6rem;background:var(--mist)}.bubble{margin:0;max-width:82%;padding:.6rem .85rem;border-radius:1rem;font-size:.9rem;line-height:1.45}.fromUser{align-self:flex-end;background:var(--blue);color:#fff;border-bottom-right-radius:.3rem}.fromBot{align-self:flex-start;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-bottom-left-radius:.3rem}.card{display:flex;align-items:center;gap:.7rem;padding:.6rem;background:var(--paper);border:1px solid var(--line);border-radius:.8rem}.swatch{width:2.6rem;height:2.6rem;flex-shrink:0;border-radius:.55rem;background:linear-gradient(135deg,#cfe0ff,#eaf1ff)}.cardBody{flex:1;display:flex;flex-direction:column;line-height:1.3}.cardBody strong{font-size:.86rem;color:var(--ink)}.price{font-size:.82rem;color:var(--slate)}.added{font-family:Poppins,sans-serif;font-weight:600;font-size:.74rem;color:var(--coral);white-space:nowrap}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes pulse{0%{box-shadow:0 0 #16b36480}70%{box-shadow:0 0 0 8px #16b36400}to{box-shadow:0 0 #16b36400}}@media(max-width:56rem){.grid{grid-template-columns:1fr;gap:2.5rem;max-width:32rem}.demo{order:-1}}@media(prefers-reduced-motion:reduce){.widget,.dot{animation:none}}