.hue-shift-example[data-v-436d63a4]{background-color:var(--bg-up);border-radius:var(--border-radius-md);margin-block:var(--sp-md);padding:var(--sp-sm)}figcaption[data-v-436d63a4]{font-family:var(--font);font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-wrap:pretty;--line-height-sm:var(--line-height-sm-sm);--line-height-base:var(--line-height-sm-base);--line-height-lg:var(--line-height-sm-lg);line-height:var(--line-height-base)}@container (width <= 320px){figcaption[data-v-436d63a4]{line-height:var(--line-height-sm)}}@container (width >= 960px){figcaption[data-v-436d63a4]{line-height:var(--line-height-lg)}}figcaption[data-v-436d63a4]{font-size:var(--font-size-sm)}figcaption strong[data-v-436d63a4]{font-weight:900}figcaption[data-v-436d63a4]{color:var(--fg-primary);font-weight:800}figure.--shifted[data-v-436d63a4],figure.--unshifted[data-v-436d63a4]{position:relative}figure.--shifted figcaption[data-v-436d63a4],figure.--unshifted figcaption[data-v-436d63a4]{color:var(--bg-up);left:var(--sp-sm);position:absolute;top:50%;transform:translateY(-50%);z-index:3}figure.--shifted[data-v-436d63a4]{display:flex;flex-direction:column-reverse;margin-block-start:var(--sp-xs)}figure.--shifted[data-v-436d63a4]:not(:last-child){margin-block-end:var(--sp-md)}.gradient-track.--hue-shift[data-v-436d63a4]{--gt-current-percent:calc(var(--brightness)*100%);--gt-animation-duration:var(--animation-duration);--gt-animation-timing-function:var(--gt-animation-timing-function)}.gradient-track.--hue-shift[data-v-436d63a4] .track{background:linear-gradient(90deg,#000 0,#0d1726 10%,#394960,gray,#c6c69f,#f2f2d9 90%,#fff)}.gradient-track.--hue-shift[data-v-436d63a4] .current-point{animation-duration:var(--gt-animation-duration);animation-fill-mode:forwards;animation-timing-function:var(--gt-animation-timing-function)}.-brighten .gradient-track.--hue-shift[data-v-436d63a4] .current-point{animation-name:track-point-brighten-436d63a4}.-darken .gradient-track.--hue-shift[data-v-436d63a4] .current-point{animation-name:track-point-darken-436d63a4}@keyframes track-point-brighten-436d63a4{0%{background-color:#000}10%{background-color:#0d1726}30%{background-color:#394960}50%{background-color:gray}70%{background-color:#c6c69f}90%{background-color:#f2f2d9}to{background-color:#fbfbe4}}@keyframes track-point-darken-436d63a4{0%{background-color:#fff}10%{background-color:#f2f2d9}30%{background-color:#c6c69f}50%{background-color:gray}70%{background-color:#394960}90%{background-color:#0d1726}to{background-color:#000}}