.fhw{--fhw-cycle:calc(var(--duration-400) * 24);--fhw-step:calc(var(--fhw-cycle) * .035)}.fhw-card{border:2px solid var(--ui-fg)}.fhw-hero .fhw-card{box-shadow:var(--ui-shadow-stamp-md-accent)}.fhw-mini .fhw-card{box-shadow:var(--ui-shadow-stamp-sm)}.fhw-thumb:after,.fhw-act:after{content:"";border:2px solid var(--color-primary-500);border-radius:inherit;opacity:0;pointer-events:none;position:absolute;inset:-.25rem}.fhw-thumb:after{border-radius:var(--radius-2xl)}.fhw-wire{background-image:repeating-linear-gradient(to bottom, var(--ui-border-strong) 0 .25rem, transparent .25rem .5rem);width:2px;height:1.25rem;margin-inline:auto;position:relative}.fhw-wire:after{content:"";background:var(--color-primary-500);transform-origin:top;opacity:0;position:absolute;inset:0}.fhw-bus{top:0;left:calc((100% + .5rem) / var(--fhw-cols) / 2 - .25rem);right:calc((100% + .5rem) / var(--fhw-cols) / 2 - .25rem);border-radius:var(--radius-full);background:var(--color-primary-500);height:2px;position:absolute}.fhw-top:before,.fhw-top .fhw-on:before{content:"";background:var(--ui-border-strong);width:2px;height:.75rem;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.fhw-top .fhw-on:before{background:var(--color-primary-500)}.fhw-plate{background:var(--paper-fixed);background-clip:padding-box}.fhw li[data-live=false] .fhw-plate img{opacity:.5;filter:grayscale()}.fhw-fill{transform-origin:0}@keyframes fhw-thumb{0%,8%{opacity:1;transform:none}12%{opacity:0;transform:translateY(.5rem)scale(.9)}18%{opacity:0;transform:translateY(-1rem)scale(.9)}26%{opacity:1;transform:translateY(.125rem)scale(1.04)}30%,to{opacity:1;transform:none}}@keyframes fhw-ring{0%,31%{opacity:0;transform:none}33%{opacity:1;transform:none}44%,to{opacity:0;transform:scale(1.3)}}@keyframes fhw-press{0%,29%{transform:none}32%{transform:scale(.86)}35%{transform:scale(1.1)}38%,to{transform:none}}@keyframes fhw-status{0%,8%{opacity:1;transform:none}12%,35%{opacity:0;transform:scale(.6)}39%{opacity:1;transform:scale(1.08)}42%,to{opacity:1;transform:none}}@keyframes fhw-signal{0%,38%{opacity:0;transform:scaleY(0)}39%{opacity:1;transform:scaleY(0)}45%{opacity:1;transform:none}50%,to{opacity:0;transform:none}}@keyframes fhw-bus{0%,8%{opacity:1;transform:none}12%{opacity:0;transform:none}13%,45%{opacity:0;transform:scaleX(0)}46%{opacity:1;transform:scaleX(0)}51%,to{opacity:1;transform:none}}@keyframes fhw-dim{0%,8%{opacity:1}12%,50%{opacity:0}51%,to{opacity:1}}@keyframes fhw-on{0%,17%{opacity:1;transform:none}18%,52%{opacity:0;transform:scale(.7)}55%{opacity:1;transform:scale(1.08)}58%,to{opacity:1;transform:none}}@keyframes fhw-pop{0%,52%{transform:none}55%{transform:scale(1.06)}58%,to{transform:none}}@keyframes fhw-fill{0%,17%{transform:none}18%,52%{transform:scaleX(0)}56%,to{transform:none}}@keyframes fhw-enter{0%{opacity:0;transform:translateY(-.75rem)scale(.9)}to{opacity:1;transform:none}}@keyframes fhw-tap{0%,to{transform:none}40%{transform:scale(.86)}75%{transform:scale(1.1)}}@keyframes fhw-pop-in{0%{opacity:0;transform:scale(.6)}70%{opacity:1;transform:scale(1.08)}to{opacity:1;transform:none}}@keyframes fhw-grow{0%{transform:scaleX(0)}to{transform:none}}@media screen and (prefers-reduced-motion:no-preference){.fhw-hero[data-fhw-play] .fhw-thumb{animation:fhw-thumb var(--fhw-cycle) var(--ease-in-out-quad) infinite both}.fhw-hero[data-fhw-play] .fhw-thumb:after,.fhw-hero[data-fhw-play] .fhw-act:after{animation:fhw-ring var(--fhw-cycle) var(--ease-out-quint) infinite both}.fhw-hero[data-fhw-play] .fhw-act{animation:fhw-press var(--fhw-cycle) var(--ease-in-out-quad) infinite both}.fhw-hero[data-fhw-play] .fhw-status{animation:fhw-status var(--fhw-cycle) var(--ease-in-out-quad) infinite both}.fhw-hero[data-fhw-play] .fhw-wire:after{animation:fhw-signal var(--fhw-cycle) var(--ease-in-out-quad) infinite both}.fhw-hero[data-fhw-play] .fhw-bus{animation:fhw-bus var(--fhw-cycle) var(--ease-in-out-quad) infinite both}.fhw-hero[data-fhw-play] .fhw-dim{animation:fhw-dim var(--fhw-cycle) linear infinite both}.fhw-hero[data-fhw-play] .fhw-on{animation:fhw-on var(--fhw-cycle) var(--ease-in-out-quad) calc(var(--k) * var(--fhw-step)) infinite both}.fhw-hero[data-fhw-play] li[data-live=true] .fhw-plate{animation:fhw-pop var(--fhw-cycle) var(--ease-in-out-quad) calc(var(--k) * var(--fhw-step)) infinite both}.fhw-hero[data-fhw-play] .fhw-fill{animation:fhw-fill var(--fhw-cycle) var(--ease-in-out-quad) calc(var(--k) * var(--fhw-step)) infinite both}@media (hover:hover){.fhw-hero[data-fhw-play]:hover .fhw-thumb,.fhw-hero[data-fhw-play]:hover .fhw-thumb:after,.fhw-hero[data-fhw-play]:hover .fhw-act,.fhw-hero[data-fhw-play]:hover .fhw-act:after,.fhw-hero[data-fhw-play]:hover .fhw-status,.fhw-hero[data-fhw-play]:hover .fhw-wire:after,.fhw-hero[data-fhw-play]:hover .fhw-bus,.fhw-hero[data-fhw-play]:hover .fhw-dim,.fhw-hero[data-fhw-play]:hover .fhw-on,.fhw-hero[data-fhw-play]:hover li[data-live=true] .fhw-plate,.fhw-hero[data-fhw-play]:hover .fhw-fill{animation-play-state:paused}}.fhw-mini[data-fhw-armed] .fhw-thumb{animation:fhw-enter var(--duration-400) var(--ease-out-quint) both paused}.fhw-mini[data-fhw-armed] .fhw-act{animation:fhw-tap var(--duration-400) var(--ease-in-out-quad) var(--duration-300) both paused}.fhw-mini[data-fhw-armed] .fhw-status{animation:fhw-pop-in var(--duration-300) var(--ease-back-out) calc(var(--duration-300) * 2) both paused}.fhw-mini[data-fhw-armed] .fhw-on{animation:fhw-pop-in var(--duration-300) var(--ease-back-out) calc(var(--duration-400) * 2 + var(--k) * var(--duration-200) * .6) both paused}.fhw-mini[data-fhw-armed] .fhw-fill{animation:fhw-grow var(--duration-300) var(--ease-out-quint) calc(var(--duration-400) * 2 + var(--k) * var(--duration-200) * .6) both paused}.fhw-mini[data-fhw-armed][data-fhw-play] .fhw-thumb,.fhw-mini[data-fhw-armed][data-fhw-play] .fhw-act,.fhw-mini[data-fhw-armed][data-fhw-play] .fhw-status,.fhw-mini[data-fhw-armed][data-fhw-play] .fhw-on,.fhw-mini[data-fhw-armed][data-fhw-play] .fhw-fill{animation-play-state:running}}
