@import "https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap";.flow-line-pulse{stroke:var(--flow-color,#6888cc);stroke-width:8px;stroke-linecap:round;stroke-dasharray:16 16;filter:blur(4px);animation:.6s linear forwards flow-down,.8s ease-out forwards flow-pulse}@keyframes flow-down{0%{stroke-dashoffset:64px}to{stroke-dashoffset:0}}@keyframes flow-pulse{0%{opacity:0}20%{opacity:.7}to{opacity:0}}@keyframes node-float{0%,to{transform:translate(0)}25%{transform:translate(1px,-1px)}50%{transform:translate(-1px,1px)}75%{transform:translate(1px,.5px)}}.machine-annotation-layer .annotation{text-transform:lowercase;font-family:Patrick Hand,Comic Sans MS,Comic Sans,sans-serif;font-style:normal;font-weight:400}.collapsible-glass{--wipe-duration:.3s;--collapse-duration:.25s;--easing:cubic-bezier(.4, 0, .2, 1);transform-origin:50%;transform-box:fill-box}.collapsible-glass--wipe-closing{animation:glassWipeClose var(--wipe-duration) var(--easing) forwards}.collapsible-glass--wipe-opening{opacity:0;animation:glassWipeOpen var(--wipe-duration) var(--easing) forwards}.collapsible-glass--closed{opacity:0}.collapsible-glass--collapsing{opacity:0;animation:glassCollapse var(--collapse-duration) var(--easing) forwards}.collapsible-glass--expanding{opacity:0;animation:glassExpand var(--collapse-duration) var(--easing) forwards;transform:scaleY(0)}.collapsible-glass--collapsed{opacity:0;visibility:hidden;transform:scaleY(0)}@keyframes glassWipeClose{0%{opacity:1}to{opacity:0}}@keyframes glassWipeOpen{0%{opacity:0}to{opacity:1}}@keyframes glassCollapse{0%{transform:scaleY(1)}to{transform:scaleY(0)}}@keyframes glassExpand{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.emoji-input-block{padding:.5rem}.input-field{border:1px solid #fff;border-radius:1em;padding:.5em}.input-field-label{color:#b0b0b0;text-align:center;-webkit-user-select:none;user-select:none;min-width:1.2em;font-size:2em;font-weight:700;line-height:1;display:inline-block}.confidence-meter{width:100%;max-width:228px;height:30px;margin-bottom:var(--spacing-xs);position:relative}.meter-track{background:var(--color-surface,#f0f0f0);border-radius:4px;width:100%;height:8px;display:flex;overflow:hidden}.meter-fill-left,.meter-fill-right{height:100%;transition:width .3s}.meter-indicator{filter:drop-shadow(0 2px 3px #0003);border-top:16px solid #ffffff80;border-left:10px solid #0000;border-right:10px solid #0000;width:0;height:0;transition:left .3s,border-top-color .3s;position:absolute;top:8px;transform:translate(-50%)}.output-buckets{width:100%;max-width:300px}.output-bucket{padding:var(--spacing-md);border-radius:var(--border-radius-lg);opacity:.8;border:3px solid;flex-direction:column;align-items:center;min-width:90px;transition:all .3s;display:flex}.output-bucket.selected{opacity:1;transform:scale(1.2);box-shadow:0 4px 12px #00000026}.output-bucket .bucket-label{font-weight:700;font-size:var(--font-size-md);align-items:center;gap:var(--spacing-xs);display:flex}.output-bucket .bucket-value{font-size:var(--font-size-sm);margin-top:var(--spacing-xs);font-family:monospace;display:none}.output-bucket .selection-indicator{margin-top:var(--spacing-xs);justify-content:center;align-items:center;display:flex;position:relative}.output-bucket .selection-indicator .object-emoji{opacity:.8;font-size:1.5em}.output-bucket .selection-indicator .result-mark{justify-content:center;align-items:center;font-size:5em;font-weight:700;display:flex;position:absolute;inset:0}.output-bucket:not(:disabled){cursor:pointer}.output-bucket:not(:disabled):hover{filter:brightness(1.05)}.choice-output-block.feedback-correct .output-bucket:not(.selected){opacity:.5}.choice-output-block.feedback-incorrect .output-bucket:not(.selected){opacity:1}.output-bucket.correct .selection-indicator .result-mark,.output-bucket.incorrect .selection-indicator .result-mark{color:var(--color-text)}.input-handle{background:linear-gradient(135deg,#4a4a4a 0%,#5a5a5a 50%,#4a4a4a 100%);border:2px solid #4a4a4a;border-radius:16px;flex-shrink:0;width:32px;height:32px;transition:background .2s,border-color .2s,box-shadow .2s,filter .15s;display:block;position:relative}.input-handle:after{content:"";pointer-events:none;background:linear-gradient(135deg,#ffffff80 0%,#fff3 50%,#0000 100%);border-radius:8px;width:16px;height:10px;position:absolute;top:4px;left:6px}:root{--slide-input-track-bg:linear-gradient(180deg, #2a2a2a 0%, #1a1a1a 100%)}.slide-input{background:var(--slide-input-track-bg);border:2px solid #3a3a3a;border-radius:20px;width:128px;height:40px;position:relative;overflow:hidden;box-shadow:inset 0 4px 8px #000c,inset 0 -2px 4px #ffffff08}.slide-input__fill{pointer-events:none;opacity:.7;border-radius:18px 0 0 18px;transition:width 50ms ease-out;position:absolute;top:0;bottom:0;left:0}.slide-input__handle-track{pointer-events:none;align-items:center;display:flex;position:absolute;inset:0 2px}.slide-input__handle-track .input-handle{left:calc(var(--slide-fraction) * (100% - 32px));transition:left 50ms ease-out;position:absolute}.slide-input__native{cursor:pointer;appearance:none;opacity:0;z-index:1;background:0 0;width:100%;height:100%;margin:0;padding:0;position:absolute;top:0;left:0}.slide-input__native::-webkit-slider-runnable-track{background:0 0;border:none;width:100%;height:100%}.slide-input__native::-moz-range-track{background:0 0;border:none;width:100%;height:100%}.slide-input__native::-webkit-slider-thumb{appearance:none;cursor:grab;background:0 0;border:none;width:32px;height:40px}.slide-input__native::-webkit-slider-thumb:active{cursor:grabbing}.slide-input__native::-moz-range-thumb{cursor:grab;background:0 0;border:none;width:32px;height:40px}.slide-input__native::-moz-range-thumb:active{cursor:grabbing}.slide-input__native:focus{outline:none}.slide-input:focus-within{box-shadow:inset 0 4px 8px #000c,inset 0 -2px 4px #ffffff08,0 0 0 2px #648cb480}.slide-input:hover{border-color:#4a4a4a}.slider-input-block{padding:.5rem}:root{--switch-track-bg:linear-gradient(180deg, #2a2a2a 0%, #1a1a1a 100%)}.input-switch{all:unset;cursor:pointer;display:inline-flex;position:relative}.input-switch[data-disabled]{cursor:not-allowed}.switch-track{background:var(--switch-track-bg);border:2px solid #3a3a3a;border-radius:20px;align-items:center;padding:4px;display:flex;position:relative;box-shadow:inset 0 4px 8px #000c,inset 0 -2px 4px #ffffff08}.switch-track--horizontal{width:90px;height:40px}.switch-track--vertical{flex-direction:column;width:40px;height:90px}.switch-track--radio{border-radius:50%;flex-direction:column;width:40px;height:40px}.switch-track:before{content:"";pointer-events:none;border-radius:16px;position:absolute;inset:4px}.switch-track--horizontal:before{background-image:repeating-linear-gradient(90deg,#0000,#0000 3px,#0000001a 3px 6px)}.switch-track--vertical:before,.switch-track--radio:before{background-image:repeating-linear-gradient(0deg,#0000,#0000 3px,#0000001a 3px 6px)}.input-switch__thumb{all:unset;display:block}.input-switch .input-handle{transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}.input-switch--horizontal .input-handle{width:38px;height:32px}.input-switch--vertical .input-handle{width:32px;height:38px}.input-switch--horizontal[data-state=unchecked] .input-handle{transform:translate(0)}.input-switch--vertical[data-state=unchecked] .input-handle{transform:translateY(46px)}.input-switch--radio[data-state=unchecked] .input-handle{transform:translateY(0)}.input-switch--horizontal[data-state=checked] .input-handle{transform:translate(46px)}.input-switch--vertical[data-state=checked] .input-handle{transform:translateY(0)}.input-switch--radio[data-state=checked] .input-handle{transform:translateY(-8px)}.input-switch[data-state=checked] .switch-track{border-color:#4a4a4a;box-shadow:inset 0 4px 8px #000c,inset 0 -2px 4px #ffffff08,0 0 20px #b4b4c833}.input-switch:hover .switch-track{border-color:#4a4a4a}.input-switches{width:100%;padding:.5rem}.machine{border-radius:var(--border-radius-xl);border:3px solid;width:100%;max-width:min(800px,80vh);margin:0 auto;position:relative;overflow:hidden}.machine.machine--teachable{border-radius:30% 30% 10% 10%}.machine__background{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.machine__section-wrapper{justify-content:center;align-items:center;width:100%;display:flex}.machine__section{justify-content:center;align-items:center;display:flex;position:relative}.machine__section--input{width:calc(var(--section-ratio) * 100%);padding:var(--spacing-sm);border-radius:var(--border-radius-xl);z-index:1;background:#ffffffbf;border:1px solid #ffffff1a}.machine.machine--compact .machine__section--input{padding:var(--spacing-xs)}.machine__section--input>*{width:100%}.machine__section--network{z-index:0;width:100%}.machine__section--output{width:calc(var(--section-ratio) * 100%);border-radius:var(--border-radius-xl);padding:var(--spacing-sm);z-index:1;background:linear-gradient(#0a0a0a 0%,#1a1a1a 100%);box-shadow:inset 0 6px 16px #000000e6,inset 0 -2px 6px #ffffff05}.machine__section--output>*{width:100%}.machine__section--dim{opacity:var(--dim-opacity);filter:grayscale(var(--dim-grayscale));transition:opacity var(--transition-slow), filter var(--transition-slow)}.machine__section--lit{opacity:1;filter:none;transition:opacity var(--transition-slow), filter var(--transition-slow);z-index:1}.machine__collapse-toggle{all:unset;cursor:pointer;border-radius:var(--border-radius);transition:transform var(--transition-fast), box-shadow var(--transition-fast), margin var(--transition-fast);justify-content:center;align-items:center;display:flex;box-shadow:0 2px 4px #0003,inset 0 1px #ffffff4d}.machine__collapse-toggle:hover{box-shadow:0 3px 6px #00000040,inset 0 1px #fff6}.machine__collapse-toggle:active{transform:scale(.95)}.machine__collapse-toggle:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.machine__collapse-toggle svg{width:1rem;height:1rem;color:inherit;transition:transform var(--transition-normal)}.network-collapse__grid{--wipe-duration:.3s;--collapse-duration:.25s;--easing:cubic-bezier(.4, 0, .2, 1);width:100%;transition:grid-template-rows var(--collapse-duration) var(--easing);grid-template-rows:1fr;display:grid}.network-collapse__grid--collapsing{animation:collapseVertical var(--collapse-duration) var(--easing) forwards}.network-collapse__grid--expanding{animation:expandVertical var(--collapse-duration) var(--easing) forwards;grid-template-rows:0fr}.network-collapse__grid--collapsed{grid-template-rows:0fr}.network-collapse__wipe{clip-path:inset(0);min-height:0;display:flex;overflow:hidden}.network-collapse__wipe--closing{animation:wipeHorizontalClose var(--wipe-duration) var(--easing) forwards}.network-collapse__wipe--opening{clip-path:inset(0 50%);animation:wipeHorizontalOpen var(--wipe-duration) var(--easing) forwards}.network-collapse__wipe--closed{clip-path:inset(0 50%)}@keyframes wipeHorizontalClose{0%{clip-path:inset(0)}to{clip-path:inset(0 50%)}}@keyframes wipeHorizontalOpen{0%{clip-path:inset(0 50%)}to{clip-path:inset(0)}}@keyframes collapseVertical{0%{grid-template-rows:1fr}to{grid-template-rows:0fr}}@keyframes expandVertical{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}.machine-comparison{width:100%;height:100%;container-type:inline-size}.machine-comparison__grid{gap:var(--machine-comparison-gap,var(--gap,var(--spacing-md)));flex-direction:column;height:100%;transition:gap .4s;display:flex}.machine-comparison__slot{flex-direction:column;flex:1;justify-content:center;min-width:0;min-height:0;transition:flex .4s,opacity .4s;display:flex}.machine-comparison__slot--reference{flex:.75;animation:.4s both machine-comparison-fade-in}.machine-comparison--vertical .machine-comparison__slot--reference{flex:.5}.machine-comparison--sizing-equal .machine-comparison__slot--reference{flex:1}.machine-comparison__label{font-size:var(--font-size-sm,.875rem);text-align:center;opacity:.8;padding-block-end:var(--spacing-xs,.25rem);font-weight:600}@container (width>=720px){.machine-comparison--auto .machine-comparison__grid{flex-direction:row}}.machine-comparison--horizontal .machine-comparison__grid{flex-direction:row}.machine-comparison--vertical .machine-comparison__grid{flex-direction:column}@keyframes machine-comparison-fade-in{0%{opacity:0;scale:.9}to{opacity:1;scale:1}}.speaker{display:inline-block;position:relative}.speaker svg{width:100%;height:100%;display:block;overflow:visible}.speaker__bg{fill:#000;opacity:.5}.speaker__body{fill:currentColor;stroke:currentColor;stroke-width:2px;stroke-linejoin:round;transition:opacity .5s ease-out}.speaker--muted .speaker__body{opacity:.25}.speaker__wave{fill:none;stroke:currentColor;stroke-width:4px;stroke-linecap:round;transform-origin:50%;transition:opacity .5s ease-out,transform .5s ease-out}.speaker--active .speaker__waves .speaker__wave{opacity:1}.speaker--muted .speaker__waves .speaker__wave{opacity:0;transform:translate(-4px)}.speaker--active .speaker__wave--1{animation:1.4s ease-in-out infinite speaker-pulse}.speaker--active .speaker__wave--2{animation:1.4s ease-in-out .15s infinite speaker-pulse}.speaker--active .speaker__wave--3{animation:1.4s ease-in-out .3s infinite speaker-pulse}@keyframes speaker-pulse{0%,to{opacity:.55}50%{opacity:1}}.speaker__mute{stroke:currentColor;stroke-width:6px;stroke-linecap:round;transition:opacity .5s ease-out}.speaker--active .speaker__mute{opacity:0}.speaker--muted .speaker__mute{opacity:.05}@media (prefers-reduced-motion:reduce){.speaker__wave,.speaker__mute{transition:none}.speaker--active .speaker__wave--1,.speaker--active .speaker__wave--2,.speaker--active .speaker__wave--3{animation:none}}
