.dd-loop{--dd-loop-h:40px;--dd-loop-gap:48px;--dd-loop-fade:var(--dd-bg);min-width:0;position:relative}.dd-loop-viewport{min-width:0;position:relative}.dd-loop-list{align-items:center;gap:24px var(--dd-loop-gap);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.dd-loop-item{flex:none;align-items:center;display:flex}.dd-loop-link{border-radius:var(--dd-radius);min-height:44px;color:var(--dd-ink);opacity:.7;transition:opacity var(--dur-ui) var(--dd-ease);align-items:center;display:inline-flex;position:relative;overflow:hidden}a.dd-loop-link:focus-visible{opacity:1;outline:2px solid var(--dd-blue);outline-offset:2px}.dd-loop-logo{width:auto;height:var(--dd-loop-h);max-width:none;display:block}.dd-loop-name{white-space:nowrap}.dd-loop[data-dd-loop] .dd-loop-viewport{overflow:clip}.dd-loop[data-dd-loop] .dd-loop-track{will-change:transform;width:max-content;display:flex}.dd-loop[data-dd-loop] .dd-loop-list{flex-wrap:nowrap;padding-inline-end:var(--dd-loop-gap)}.dd-loop[data-dd-loop] .dd-loop-viewport:before,.dd-loop[data-dd-loop] .dd-loop-viewport:after{content:"";z-index:1;pointer-events:none;width:min(96px,12%);position:absolute;inset-block:0}.dd-loop[data-dd-loop] .dd-loop-viewport:before{background:linear-gradient(to right, var(--dd-loop-fade), transparent);left:0}.dd-loop[data-dd-loop] .dd-loop-viewport:after{background:linear-gradient(to left, var(--dd-loop-fade), transparent);right:0}.dd-loop-toggle{min-height:44px;color:var(--dd-ink-body);border-radius:var(--dd-radius);transition:color var(--dur-ui) var(--dd-ease);align-items:center;gap:8px;margin-top:16px;display:inline-flex}.dd-loop-toggle:focus-visible{outline:2px solid var(--dd-blue);outline-offset:2px}.dd-loop-toggle:active{scale:var(--dd-press-icon)}@media (prefers-reduced-motion:reduce){.dd-loop-link{opacity:1;transition:none}}@media (hover:hover) and (pointer:fine){a.dd-loop-link:hover{opacity:1}.dd-loop-toggle:hover{color:var(--dd-ink)}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) and (forced-colors:none){:root:not([data-dd-motion=paused]) a.dd-loop-link:after{content:"";pointer-events:none;background:linear-gradient(105deg, transparent 35%, color-mix(in srgb, var(--dd-ink) 25%, transparent) 50%, transparent 65%);mix-blend-mode:overlay;background-position:150% 0;background-size:250% 100%;position:absolute;inset:0}:root:not([data-dd-motion=paused]) a.dd-loop-link:is(:hover,:focus-visible):after{transition:background-position var(--dur-reveal) var(--dd-ease);background-position:-50% 0}}