.ill.demo{text-align:left;color:var(--testo);background:linear-gradient(165deg,#191935,#0e0e1e 70%);border:1px solid #ffffff24;border-radius:20px;font-size:.92rem;position:relative;box-shadow:0 40px 90px -40px #000000e6,0 0 0 1px #00b4d814,0 0 80px -30px #ff139373}.ill.demo:before{content:"";border-radius:inherit;pointer-events:none;-webkit-mask-composite:xor;background:linear-gradient(135deg,#00b4d8b3,#0000 35% 65%,#ff1393b3);padding:1px;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-composite:exclude;mask-mode:match-source,match-source}.demo__top{background:#ffffff0a;border-bottom:1px solid #ffffff1a;align-items:center;gap:12px;padding:13px 18px;display:flex}.demo__top b{flex:1;font-size:.95rem;font-weight:700}.demo__live{color:var(--lime);letter-spacing:.02em;white-space:nowrap;align-items:center;gap:8px;font:600 .72rem/1 ui-monospace,Cascadia Mono,Consolas,monospace;display:inline-flex}.demo__live i{background:var(--lime);width:8px;height:8px;box-shadow:0 0 10px var(--lime);border-radius:50%;animation:2s ease-in-out infinite respira}@keyframes respira{50%{opacity:.35}}.demo__ex{color:var(--tenue);border:1px solid #ffffff47;border-radius:999px;padding:3px 10px;font-size:.72rem;font-weight:700}.demo__body{padding:20px 20px 22px}.js .demo [data-s]{opacity:0;transition:opacity .3s var(--ease), translate .3s var(--ease), background-color .4s, transform .8s var(--ease);translate:0 10px}.js .demo [data-s].is-on{opacity:1;translate:0}.js .demo [data-s].is-off{opacity:0}.demo--agenti .demo__body{align-content:start;gap:18px;min-height:420px;display:grid}.chat{gap:10px;display:grid}.chat .msg{border-radius:16px;max-width:84%;margin:0;padding:10px 14px;line-height:1.45}.msg--c{color:#fff;background:linear-gradient(135deg,#ff1393,#c80b78);border-bottom-right-radius:4px;justify-self:end}.msg--a{background:#00b4d81f;border:1px solid #00b4d873;border-bottom-left-radius:4px;justify-self:start}.slot{display:grid}.slot>*{grid-area:1/1}.typing{background:#00b4d81f;border:1px solid #00b4d873;align-items:center;gap:5px;width:62px;height:40px;display:flex}.typing i{background:var(--azzurro);border-radius:50%;width:7px;height:7px;animation:1s ease-in-out infinite punti}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}@keyframes punti{0%,to{opacity:.35;translate:0}50%{opacity:1;translate:0 -3px}}.trace{color:var(--tenue);border-top:1px dashed #ffffff2e;flex-wrap:wrap;gap:8px 10px;margin:0;padding:14px 0 0;font:600 .76rem/1 ui-monospace,Cascadia Mono,Consolas,monospace;list-style:none;display:flex}.trace li{background:#ffffff0d;border:1px solid #ffffff24;border-radius:999px;align-items:center;gap:8px;padding:7px 12px;display:inline-flex}.trace i{background:var(--lime);width:8px;height:8px;box-shadow:0 0 8px var(--lime);border-radius:50%}.trace li:last-child{color:var(--lime);border-color:color-mix(in srgb, var(--lime) 55%, transparent)}.tl{align-content:start;gap:18px;min-height:380px;display:grid}.tl__modo{flex-wrap:wrap;gap:8px;display:flex}.modo{color:var(--tenue);border:1px solid #fff3;border-radius:999px;padding:4px 12px;font-size:.76rem;font-weight:700}.modo.is-a{background:var(--lime);border-color:var(--lime);color:var(--blu)}.tl__sett{color:var(--tenue);letter-spacing:.04em;text-transform:uppercase;grid-template-columns:repeat(3,1fr);margin-bottom:8px;font-size:.74rem;font-weight:700;display:grid}.tl__sett span{border-left:1px solid #fff3;padding-left:8px}.tl__area{background-image:repeating-linear-gradient(90deg,#ffffff12 0 1px,#0000 1px 6.66667%);gap:14px;padding-block:6px;display:grid;position:relative}.tl__ph{background:var(--lime);width:2px;box-shadow:0 0 14px var(--lime);z-index:2;opacity:0;position:absolute;top:-6px;bottom:-6px;left:0}.demo.is-play .tl__ph{opacity:1;animation:10s linear forwards ph}@keyframes ph{to{left:100%}}.tl__riga{gap:6px;display:grid}.tl__riga small{color:#dcdcec;padding-left:4px;font-size:.8rem;font-weight:600}.tl__pista{height:26px;position:relative}.tl__barra{height:100%;top:0;left:calc((var(--da) - 1) * 100% / 15);width:calc(var(--per) * 100% / 15);transform-origin:0;border-radius:999px;position:absolute}.js .demo .tl__barra[data-s]{transform:scaleX(0)}.js .demo .tl__barra[data-s].is-on{transform:scaleX(1)}.tl__barra--1{background:linear-gradient(90deg,#ff1393,#ff6cb9);box-shadow:0 0 22px -4px #ff1393b3}.tl__barra--2{background:linear-gradient(90deg,#00b4d8,#5fd8f0);box-shadow:0 0 22px -4px #00b4d8b3}.tl__barra--3{background:linear-gradient(90deg,#c8ff2e,#8fe33a);box-shadow:0 0 22px -4px #c8ff2e80}.nota{color:var(--tenue);border:1px dashed #ffffff47;border-radius:12px;align-items:center;gap:10px;max-width:none;margin:0;padding:11px 14px;font-size:.86rem;font-weight:600;display:flex}.nota svg{width:18px;height:18px;color:var(--lime);flex:none}.liv{align-content:start;gap:18px;min-height:380px;display:grid}.liv__r{grid-template-columns:1fr auto;gap:8px 12px;font-weight:600;display:grid}.liv__r em{color:var(--tenue);border:1px solid #ffffff38;border-radius:999px;padding:3px 10px;font-size:.76rem;font-style:normal;font-weight:700}.barra{background:#ffffff1a;border-radius:999px;grid-column:1/-1;height:10px;overflow:hidden}.barra i{border-radius:inherit;width:0;height:100%;transition:width 1.1s var(--ease) .15s;background:linear-gradient(90deg,#00b4d8,#ff1393);display:block;box-shadow:0 0 16px #ff139399}.liv__r.is-on .barra i,html:not(.js) .barra i{width:var(--v)}.liv__ris{background:#ffffff0d;border:1px solid #ffffff1f;border-radius:14px;gap:10px;padding:14px 16px;display:grid}.liv__ris small{letter-spacing:.06em;text-transform:uppercase;color:var(--tenue);font-size:.74rem;font-weight:700}.liv__ris ol{gap:10px;margin:0;padding:0;list-style:none;display:grid}.liv__ris li{grid-template-columns:auto 1fr auto;align-items:center;gap:12px;font-weight:600;display:grid}.liv__ris li b{background:var(--lime);width:26px;height:26px;color:var(--blu);border-radius:50%;place-items:center;font-size:.8rem;display:grid}.liv__ris li span{color:#ff9fd3;background:#ff13932e;border:1px solid #ff139380;border-radius:999px;padding:3px 10px;font-size:.74rem;font-weight:700}@media (width<=560px){.demo__body{padding:16px 14px 18px}.chat .msg{max-width:92%}.demo__live{display:none}.demo--agenti .demo__body,.tl,.liv{min-height:0}.trace{font-size:.7rem}}@media (prefers-reduced-motion:reduce){.typing i,.demo__live i{animation:none}.typing,.tl__ph{display:none}}
