.live-grid{background-image:linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);background-size:28px 28px;-webkit-mask-image:radial-gradient(120% 95% at 50% 35%,#000 35%,#0000 100%);mask-image:radial-gradient(120% 95% at 50% 35%,#000 35%,#0000 100%)}.dark .live-grid,.live-grid.is-strong{background-image:linear-gradient(#ffffff0e 1px,#0000 1px),linear-gradient(90deg,#ffffff0e 1px,#0000 1px);background-image:linear-gradient(lab(100% 0 0/.055) 1px,#0000 1px),linear-gradient(90deg,lab(100% 0 0/.055) 1px,#0000 1px)}.live-page section{scroll-margin-top:6.5rem}.live-well{color:var(--tone);background:color-mix(in oklch, var(--tone) 13%, transparent);box-shadow:inset 0 0 0 1px color-mix(in oklch, var(--tone) 34%, transparent)}.live-well[data-dashed]{box-shadow:none;border:1px dashed color-mix(in oklch, var(--muted-foreground) 45%, transparent);opacity:.75;background:0 0}.live-ping,.live-pulse{border-radius:inherit;pointer-events:none;box-shadow:0 0 0 1.5px var(--tone);opacity:0;position:absolute;inset:-1px}:where(:root:not([data-motion=reduced],[data-motion=off])) .live-ping{animation:live-ping .9s var(--ease-snap) both}:where(:root:not([data-motion=reduced],[data-motion=off])) .live-pulse{animation:live-pulse 1.8s var(--ease-snap) infinite}@keyframes live-ping{0%{opacity:.9;scale:1}to{opacity:0;scale:1.55}}@keyframes live-pulse{0%{opacity:.7;scale:1}70%,to{opacity:0;scale:1.4}}.live-node{transition:border-color var(--dur-quick) ease, background-color var(--dur-quick) ease, box-shadow var(--dur-quick) ease}.live-node:hover{border-color:color-mix(in oklch, var(--tone) 55%, transparent);background-color:color-mix(in oklch, var(--tone) 8%, transparent)}.live-node:active{background-color:color-mix(in oklch, var(--tone) 13%, transparent)}.live-node:focus-visible{box-shadow:0 0 0 2px var(--background), 0 0 0 4px color-mix(in oklch, var(--tone) 80%, transparent);outline:none}.live-node .node-go{opacity:0;transition:opacity var(--dur-quick) ease, translate var(--dur-base) var(--ease-snap);translate:-3px 3px}.live-node:is(:hover,:focus-visible) .node-go{opacity:1;translate:0}.live-node[data-hero] .hero-glow{background:radial-gradient(90% 80% at 50% 100%, color-mix(in oklch, var(--ember) 30%, transparent), transparent 70%);opacity:.55}:where(:root:not([data-motion=reduced],[data-motion=off])) .live-node[data-hero][data-hot] .hero-glow{animation:2.2s ease-in-out infinite hero-breathe}@keyframes hero-breathe{0%,to{opacity:.5}50%{opacity:1}}.flow-link{--from:var(--muted-foreground);--to:var(--muted-foreground);display:block;position:relative}.flow-track,.flow-coin,.flow-comet,.flow-head{pointer-events:none;position:absolute}.flow-track{border-radius:999px}.flow-coin{background:var(--to);width:6px;height:6px;box-shadow:0 0 8px color-mix(in oklch, var(--to) 70%, transparent);opacity:0;border-radius:1.5px}.flow-comet{opacity:0;border-radius:999px}.flow-head{width:12px;height:12px;color:var(--to)}.flow-link[data-state=idle] .flow-track{background-image:repeating-linear-gradient(var(--flow-angle), color-mix(in oklch, var(--from) 40%, transparent) 0 4px, transparent 4px 9px)}.flow-link[data-state=idle] .flow-head{color:color-mix(in oklch, var(--muted-foreground) 70%, transparent)}.flow-link[data-state=active] .flow-track{background-image:linear-gradient(var(--flow-angle), color-mix(in oklch, var(--from) 75%, transparent), var(--to));box-shadow:0 0 10px -2px color-mix(in oklch, var(--to) 80%, transparent)}.flow-link[data-state=done] .flow-track{background-image:linear-gradient(var(--flow-angle), var(--from), var(--to));opacity:.75}:where(:root:not([data-motion=reduced],[data-motion=off])) .flow-link[data-state=idle] .flow-track{animation:2.8s linear infinite flow-drift}@keyframes flow-drift{to{background-position:var(--flow-drift)}}.flow-link.is-x{--flow-angle:90deg;--flow-drift:9px 0;width:100%;height:14px}.flow-link.is-x .flow-track{height:2px;margin-top:-1px;top:50%;left:0;right:7px}.flow-link.is-x .flow-coin{top:50%;left:calc(var(--t,0) * (100% - 8px));margin:-3px 0 0 -3px}.flow-link.is-x .flow-comet{width:26px;height:3px;top:50%;left:calc(var(--t,0) * (100% - 6px));background:linear-gradient(90deg, transparent, var(--to));box-shadow:0 0 12px var(--to);margin:-1.5px 0 0 -26px}.flow-link.is-x .flow-head{margin-top:-6px;top:50%;right:-3px}.flow-link.is-y,.flow-link.is-auto{--flow-angle:180deg;--flow-drift:0 9px;width:14px;height:100%;min-height:18px}.flow-link:is(.is-y,.is-auto) .flow-track{width:2px;margin-left:-1px;top:0;bottom:7px;left:50%}.flow-link:is(.is-y,.is-auto) .flow-coin{left:50%;top:calc(var(--t,0) * (100% - 8px));margin:-3px 0 0 -3px}.flow-link:is(.is-y,.is-auto) .flow-comet{width:3px;height:26px;left:50%;top:calc(var(--t,0) * (100% - 6px));background:linear-gradient(180deg, transparent, var(--to));box-shadow:0 0 12px var(--to);margin:-26px 0 0 -1.5px}.flow-link:is(.is-y,.is-auto) .flow-head{margin-left:-6px;bottom:-3px;left:50%;rotate:90deg}@container pipe (min-width:40rem){.flow-link.is-auto{--flow-angle:90deg;--flow-drift:9px 0;width:100%;height:14px;min-height:0}.flow-link.is-auto .flow-track{width:auto;height:2px;margin:-1px 0 0;inset:50% 7px auto 0}.flow-link.is-auto .flow-coin{top:50%;left:calc(var(--t,0) * (100% - 8px))}.flow-link.is-auto .flow-comet{top:50%;left:calc(var(--t,0) * (100% - 6px));background:linear-gradient(90deg, transparent, var(--to));width:26px;height:3px;margin:-1.5px 0 0 -26px}.flow-link.is-auto .flow-head{margin:-6px 0 0;inset:50% -3px auto auto;rotate:0deg}}.live-tabs [data-slot=selection-indicator]{background:color-mix(in oklch, var(--feed-tone) 15%, transparent);box-shadow:inset 0 0 0 1px color-mix(in oklch, var(--feed-tone) 45%, transparent);border:0;transition-property:translate,width,height,opacity,background-color,box-shadow}.live-tabs [data-slot=tabs-trigger]:focus-visible{--tw-ring-shadow:0 0 0 2px color-mix(in oklch, var(--tone) 60%, transparent);border-color:#0000;outline:none}.live-tabs [data-slot=tabs-trigger] .tab-label{opacity:0;max-width:0;transition:max-width var(--dur-base) var(--ease-snap), margin-left var(--dur-base) var(--ease-snap), opacity var(--dur-quick) ease;margin-left:0;display:inline-block;overflow:hidden}.live-tabs [data-slot=tabs-trigger][data-state=active] .tab-label{opacity:1;max-width:6rem;margin-left:.375rem}@container feed (min-width:40rem){.live-tabs [data-slot=tabs-trigger] .tab-label{opacity:1;max-width:6rem;margin-left:.375rem}}.tab-dot{background:var(--tone);width:6px;height:6px;box-shadow:0 0 0 2px var(--card);border-radius:999px;position:absolute;top:3px;right:3px}:where(:root:not([data-motion=reduced],[data-motion=off])) .tab-dot{animation:ai-pop .38s var(--ease-pop) both}.feed-list[data-glide] .feed-slot{transition:translate .34s var(--ease-snap)}.feed-row{transition:background-color var(--dur-quick) ease, translate var(--dur-press) ease;position:relative}.feed-row:hover{background-color:color-mix(in oklch, var(--tone) 7%, transparent)}.feed-row:active{background-color:color-mix(in oklch, var(--tone) 12%, transparent);translate:0 1px}.feed-row:focus-visible{box-shadow:inset 0 0 0 2px color-mix(in oklch, var(--tone) 75%, transparent);outline:none}.feed-row .feed-accent{background:var(--tone);width:2px;transition:scale var(--dur-base) var(--ease-snap);border-radius:2px;position:absolute;top:10px;bottom:10px;left:0;scale:1 0}.feed-row:is(:hover,:focus-visible) .feed-accent{scale:1}.feed-row .feed-go{opacity:0;transition:opacity var(--dur-quick) ease, translate var(--dur-base) var(--ease-snap);translate:-4px}.feed-row:is(:hover,:focus-visible) .feed-go{opacity:1;translate:0}.feed-row[data-new]:after{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(90deg, color-mix(in oklch, var(--tone) 24%, transparent), transparent 75%);opacity:0;position:absolute;inset:0}:where(:root:not([data-motion=reduced],[data-motion=off])) .feed-row[data-new]{animation:feed-in .52s var(--ease-snap) both}:where(:root:not([data-motion=reduced],[data-motion=off])) .feed-row[data-new]:after{animation:1.6s ease-out both feed-flash}@keyframes feed-in{0%{opacity:0;translate:-12px}to{opacity:1;translate:0}}@keyframes feed-flash{0%{opacity:1}to{opacity:0}}.feed-card-flash{box-shadow:inset 0 0 0 2px var(--feed-tone);opacity:0}:where(:root:not([data-motion=reduced],[data-motion=off])) .feed-card-flash{animation:feed-card-flash 1s var(--ease-snap)}@keyframes feed-card-flash{0%{opacity:1}to{opacity:0}}.furnace-ember{opacity:0}:where(:root:not([data-motion=reduced],[data-motion=off])) .furnace-ring{animation:28s linear infinite furnace-spin}:where(:root:not([data-motion=reduced],[data-motion=off])) .furnace-glow{animation:4.2s ease-in-out infinite furnace-breathe}:where(:root:not([data-motion=reduced],[data-motion=off])) .furnace-flame{transform-origin:50% 90%;animation:3s ease-in-out infinite furnace-flicker}:where(:root:not([data-motion=reduced],[data-motion=off])) .furnace-ember{animation:3.6s cubic-bezier(.3,.6,.4,1) infinite ember-rise;animation-delay:calc(var(--i) * -.6s)}:where(:root:is([data-motion=reduced],[data-motion=off])) .furnace-ember:nth-child(odd){opacity:.5;translate:var(--dx) -26px}@keyframes furnace-spin{to{rotate:360deg}}@keyframes furnace-breathe{0%,to{opacity:.45;scale:.94}50%{opacity:.85;scale:1.06}}@keyframes furnace-flicker{0%,to{rotate:0deg;scale:1}30%{rotate:-1.5deg;scale:.98 1.04}60%{rotate:1deg;scale:1.02 .98}}@keyframes ember-rise{0%{opacity:0;translate:0}15%{opacity:1}to{opacity:0;translate:var(--dx) -52px}}:where(:root:not([data-motion=reduced],[data-motion=off])) .live-page :is(a,button,[role=button],[role=tab],[data-icon-host]):is(:hover,:focus-visible) .lucide-airdrop:not([data-icon-static]){transform-origin:50% 10%;animation:glyph-sway .64s var(--ease-snap)}:where(:root:not([data-motion=reduced],[data-motion=off])) .live-page :is(a,button,[role=button],[role=tab],[data-icon-host]):is(:hover,:focus-visible) .lucide-sweep:not([data-icon-static]){transform-origin:60% 15%;animation:glyph-swish .56s var(--ease-snap)}:where(:root:not([data-motion=reduced],[data-motion=off])) .live-page :is(a,button,[role=button],[role=tab],[data-icon-host]):is(:hover,:focus-visible) .lucide-capsule:not([data-icon-static]){animation:glyph-tilt .56s var(--ease-snap)}:where(:root:not([data-motion=reduced],[data-motion=off])) .live-page :is(a,button,[role=button],[role=tab],[data-icon-host]):is(:hover,:focus-visible) .lucide-creator:not([data-icon-static]){animation:ai-bob .48s var(--ease-snap)}@keyframes glyph-sway{0%,to{rotate:0deg}30%{rotate:-9deg}65%{rotate:6deg}}@keyframes glyph-swish{0%,to{rotate:0deg}35%{rotate:-11deg}70%{rotate:4deg}}@keyframes glyph-tilt{0%,to{rotate:0deg}45%{rotate:12deg}}.live-page :is(h1,h2)[tabindex="-1"]:focus{outline:none}
