@layer theme,base;@layer components{.system-demo[data-astro-cid-gfflyefe] .sd{background-color:var(--color-surface-dark);color:var(--color-on-dark);border-radius:6px;outline:1px solid #0000;overflow:hidden;box-shadow:0 1px #14120f0f,0 40px 80px -40px #14120f8c;container-type:inline-size}.system-demo[data-astro-cid-gfflyefe] .sd-bar,.system-demo[data-astro-cid-gfflyefe] .sd-who,.system-demo[data-astro-cid-gfflyefe] .sd-log-head,.system-demo[data-astro-cid-gfflyefe] [data-from=system] .sd-bubble{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--color-on-dark-muted);font-weight:500;line-height:1}.system-demo[data-astro-cid-gfflyefe] .sd-bar{border-bottom:1px solid var(--color-line-dark);align-items:center;gap:.75rem;min-height:2.875rem;padding:.375rem 1.125rem;font-size:.6875rem;display:flex}.system-demo[data-astro-cid-gfflyefe] .sd-bar:has(.sd-control){padding-right:.75rem}.system-demo[data-astro-cid-gfflyefe] .sd-title{color:var(--color-on-dark);white-space:nowrap;align-items:center;gap:.625rem;margin-right:auto;font-weight:600;display:flex}.system-demo[data-astro-cid-gfflyefe] .sd-dot{background-color:var(--color-accent);width:.5rem;height:.5rem;box-shadow:0 0 0 4px color-mix(in srgb, var(--color-accent) 18%, transparent);border-radius:50%;flex:none}.system-demo[data-astro-cid-gfflyefe] .sd-status{white-space:nowrap}.system-demo[data-astro-cid-gfflyefe] .sd-control{border:1px solid var(--color-line-dark);min-height:2rem;color:var(--color-on-dark);font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-color:#0000;border-radius:3px;flex:none;align-items:center;gap:.4375rem;padding-inline:.625rem .75rem;font-weight:600;transition:border-color .15s,background-color .15s;display:inline-flex}.system-demo[data-astro-cid-gfflyefe] .sd-control svg{width:.75rem;height:.75rem}@media (hover:hover){.system-demo[data-astro-cid-gfflyefe] .sd-control:hover{border-color:var(--color-on-dark-muted);background-color:color-mix(in srgb, var(--color-on-dark) 6%, transparent)}}.system-demo[data-astro-cid-gfflyefe] .sd-chat{flex-direction:column;gap:.625rem;padding:1.25rem 1.125rem 1.375rem;display:flex}.system-demo[data-astro-cid-gfflyefe] .sd-step{flex-direction:column;max-width:84%;display:flex}.system-demo[data-astro-cid-gfflyefe] .sd-step[data-from=customer]{align-self:flex-start}.system-demo[data-astro-cid-gfflyefe] .sd-step[data-from=agent]{align-self:flex-end;align-items:flex-end}.system-demo[data-astro-cid-gfflyefe] .sd-step[data-from=system]{align-self:center;margin-block:.25rem}.system-demo[data-astro-cid-gfflyefe] .sd-who{margin:.25rem .125rem .375rem;font-size:.65625rem}.system-demo[data-astro-cid-gfflyefe] .sd-bubble{border:1px solid #0000;border-radius:12px;padding:.5625rem .75rem;font-size:.875rem;line-height:1.45;position:relative}.system-demo[data-astro-cid-gfflyefe] [data-from=customer] .sd-bubble,.system-demo[data-astro-cid-gfflyefe] [data-from=customer] .sd-typing{background-color:color-mix(in srgb, var(--color-on-dark) 8%, var(--color-surface-dark));border-top-left-radius:3px}.system-demo[data-astro-cid-gfflyefe] [data-from=agent] .sd-bubble,.system-demo[data-astro-cid-gfflyefe] [data-from=agent] .sd-typing{background-color:var(--color-on-dark);color:var(--color-ink);border-top-right-radius:3px}.system-demo[data-astro-cid-gfflyefe] [data-from=system] .sd-bubble{border-color:var(--color-line-dark);text-align:center;border-radius:999px;align-items:center;gap:.5rem;padding:.4375rem .75rem;font-size:.6875rem;line-height:1.2;display:flex}.system-demo[data-astro-cid-gfflyefe] .sd-check{width:.75rem;height:.75rem;color:var(--color-accent);flex:none}.system-demo[data-astro-cid-gfflyefe] .sd-typing{visibility:visible;border-radius:12px;gap:.25rem;padding:.875rem;display:none;position:absolute;top:-1px}.system-demo[data-astro-cid-gfflyefe] [data-from=customer] .sd-typing{left:-1px}.system-demo[data-astro-cid-gfflyefe] [data-from=agent] .sd-typing{right:-1px}.system-demo[data-astro-cid-gfflyefe] .sd-step[data-state=typing] .sd-typing{display:inline-flex}.system-demo[data-astro-cid-gfflyefe] .sd-typing i{opacity:.35;background-color:currentColor;border-radius:50%;width:.375rem;height:.375rem;animation:1.2s ease-in-out infinite sd-dot}.system-demo[data-astro-cid-gfflyefe] .sd-typing i:nth-child(2){animation-delay:.15s}.system-demo[data-astro-cid-gfflyefe] .sd-typing i:nth-child(3){animation-delay:.3s}.system-demo[data-astro-cid-gfflyefe] .sd-log-head{border-top:1px solid var(--color-line-dark);justify-content:space-between;padding:.875rem 1.125rem .625rem;font-size:.6875rem;display:flex}.system-demo[data-astro-cid-gfflyefe] .sd-count,.system-demo[data-astro-cid-gfflyefe] .sd-time{font-variant-numeric:tabular-nums}.system-demo[data-astro-cid-gfflyefe] .sd-log{font-family:var(--font-mono);margin:0;padding:0 0 .75rem;font-size:.78125rem;line-height:1.35;list-style:none}.system-demo[data-astro-cid-gfflyefe] .sd-row{color:var(--color-on-dark-muted);grid-template-columns:7ch 9ch minmax(0,1fr) 3ch;align-items:baseline;gap:.75rem;padding:.5rem 1.125rem;display:grid}.system-demo[data-astro-cid-gfflyefe] .sd-sys{color:var(--color-on-dark);white-space:nowrap;font-weight:600}.system-demo[data-astro-cid-gfflyefe] .sd-st{text-align:right}.system-demo[data-astro-cid-gfflyefe] .sd-row[data-state=live]{background-color:color-mix(in srgb, var(--color-accent) 6%, var(--color-surface-dark));box-shadow:inset 2px 0 0 var(--color-accent)}.system-demo[data-astro-cid-gfflyefe] .sd-row[data-state=live] .sd-act{color:var(--color-on-dark)}.system-demo[data-astro-cid-gfflyefe] .sd-row[data-state=live] .sd-st{color:var(--color-accent);font-weight:600}.system-demo[data-astro-cid-gfflyefe] .sd-row[data-state=pending] .sd-sys{color:var(--color-on-dark-muted);font-weight:500}.system-demo[data-astro-cid-gfflyefe] .sd-row[data-state=pending] :is(.sd-time,.sd-act)>span{visibility:hidden}.system-demo[data-astro-cid-gfflyefe] .sd-row[data-state=pending] .sd-time,.system-demo[data-astro-cid-gfflyefe] .sd-row[data-state=pending] .sd-act{background:repeating-linear-gradient(90deg, var(--color-line-dark) 0 .25rem, transparent .25rem .5rem) 0 .6em / 100% 1px no-repeat}.system-demo[data-astro-cid-gfflyefe] .sd-step:is([data-state=hidden],[data-state=typing]){visibility:hidden}.system-demo[data-astro-cid-gfflyefe] [data-mode=animated] .sd-step[data-state=in]{animation:.32s cubic-bezier(.2,.7,.2,1) sd-pop}.system-demo[data-astro-cid-gfflyefe] .sd-step[data-from=customer]{transform-origin:0 100%}.system-demo[data-astro-cid-gfflyefe] .sd-step[data-from=agent]{transform-origin:100% 100%}.system-demo[data-astro-cid-gfflyefe] .sd-step[data-from=system]{transform-origin:50% 100%}.system-demo[data-astro-cid-gfflyefe] [data-mode=animated] .sd-row[data-state=live]{animation:.45s cubic-bezier(.3,.6,.2,1) sd-wipe}.system-demo[data-astro-cid-gfflyefe] [data-playing=true] .sd-dot{animation:1.6s ease-in-out infinite sd-pulse}.system-demo[data-astro-cid-gfflyefe] [data-playing=false] .sd-typing i{animation-play-state:paused}@media (scripting:enabled) and (prefers-reduced-motion:no-preference){.system-demo[data-astro-cid-gfflyefe] [data-mode=ssr] :is(.sd-step,.sd-row,.sd-count){visibility:hidden;animation:0s 3s forwards sd-reveal}}@container (width<=26rem){.system-demo[data-astro-cid-gfflyefe] .sd-bar{padding-inline:1rem}.system-demo[data-astro-cid-gfflyefe] .sd-status{display:none}.system-demo[data-astro-cid-gfflyefe] .sd-chat{padding-inline:1rem}.system-demo[data-astro-cid-gfflyefe] .sd-step{max-width:90%}.system-demo[data-astro-cid-gfflyefe] .sd-bubble{font-size:.90625rem}.system-demo[data-astro-cid-gfflyefe] .sd-log-head{padding-inline:1rem}.system-demo[data-astro-cid-gfflyefe] .sd-row{grid-template-columns:9ch minmax(0,1fr) 3ch;padding-inline:1rem}.system-demo[data-astro-cid-gfflyefe] .sd-time{display:none}}@media (forced-colors:active){.system-demo[data-astro-cid-gfflyefe] .sd-row[data-state=live]{outline-offset:-2px;outline:2px solid canvastext}.system-demo[data-astro-cid-gfflyefe] .sd-dot{background-color:canvastext}}}@layer utilities;@keyframes sd-pop{0%{transform:translateY(.5rem)scale(.94)}}@keyframes sd-wipe{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes sd-dot{30%{opacity:1;transform:translateY(-2px)}}@keyframes sd-pulse{50%{box-shadow:0 0 0 6px color-mix(in srgb, var(--color-accent) 0%, transparent)}}@keyframes sd-reveal{to{visibility:visible}}
