@property --thread-order{syntax:"<integer>";inherits:false}@property --thread-width{syntax:"<length>";inherits:false}@property --thread-height{syntax:"<length>";inherits:false}.thread{--thread-width: 100px;--thread-height: 100px;--thread-gap: calc(var(--thread-width) * 0.07);--thread-column-gap: var(--thread-gap);--thread-row-gap: var(--thread-gap);--thread-dynamic-width: var(--thread-width);--thread-dynamic-height: var(--thread-height);--thread-dynamic-column-gap: var(--thread-column-gap);--thread-dynamic-row-gap: var(--thread-row-gap);--thread-dynamic-left-peek: calc(var(--thread-width) * 0.3);--thread-dynamic-right-peek: calc(var(--thread-width) * 0.3);--thread-dynamic-layout-error: 0px;position:relative}.thread.debug{border:19px solid red;margin:7px}.thread.collapsed.peek-overflow{margin-left:calc(-1*var(--thread-dynamic-left-peek) + -1*var(--thread-dynamic-column-gap));margin-right:calc(-1*var(--thread-dynamic-right-peek) + -1*var(--thread-dynamic-column-gap) + (var(--thread-dynamic-layout-error)))}.thread.expanded.peek-overflow>.thread-viewport>.thread-scroll>.thread-layout{margin-right:-5px;padding-left:0;padding-right:0}.thread-left-control,.thread-right-control{display:none}.thread-left-control.collapsed,.thread-right-control.collapsed{display:block;box-sizing:border-box;height:100%;background-color:transparent;background-image:linear-gradient(transparent, transparent),linear-gradient(transparent, transparent);background-repeat:no-repeat space;background-size:auto var(--thread-dynamic-height);content:"";position:absolute;top:0;z-index:1;border:0;padding:0;margin:0}.thread-left-control.collapsed.single-page,.thread-right-control.collapsed.single-page{display:none}.thread-left-control.collapsed:hover,.thread-right-control.collapsed:hover{cursor:pointer}.thread-left-control.collapsed.debug,.thread-right-control.collapsed.debug{height:calc(100% - var(--horizontal-scrollbar-height, 0))}.thread-left-control.collapsed{width:var(--thread-dynamic-left-peek);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' stroke='none' viewBox='0 0 13 100'%3E%3Cpath d='M 13 41 L 0 49 L 0 51 L 13 59 L 13 54.5 L 5 50 L 13 45.5 L 13 41'/%3E%3C/svg%3E"),linear-gradient(transparent, transparent);background-position:center center,top left;left:0}.thread-left-control.collapsed.dark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='black' stroke='none' viewBox='0 0 13 100'%3E%3Cpath d='M 13 41 L 0 49 L 0 51 L 13 59 L 13 54.5 L 5 50 L 13 45.5 L 13 41'/%3E%3C/svg%3E"),linear-gradient(transparent, transparent)}.thread-left-control.collapsed.leftmost-page{visibility:hidden}.thread-left-control.collapsed:hover{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='black' stroke='none' viewBox='0 0 13 100'%3E%3Cpath d='M 13 41 L 0 49 L 0 51 L 13 59 L 13 54.5 L 5 50 L 13 45.5 L 13 41'/%3E%3C/svg%3E"),linear-gradient(to right, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.2))}.thread-left-control.collapsed:hover.dark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' stroke='none' viewBox='0 0 13 100'%3E%3Cpath d='M 13 41 L 0 49 L 0 51 L 13 59 L 13 54.5 L 5 50 L 13 45.5 L 13 41'/%3E%3C/svg%3E"),linear-gradient(to right, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.2))}.thread-right-control.collapsed{width:var(--thread-dynamic-right-peek);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' stroke='none' viewBox='0 0 13 100'%3E%3Cpath d='M 0 41 L 13 49 L 13 51 L 0 59 L 0 54.5 L 8 50 L 0 45.5 L 0 41'/%3E%3C/svg%3E"),linear-gradient(transparent, transparent);background-position:center center,top right;right:0}.thread-right-control.collapsed.dark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='black' stroke='none' viewBox='0 0 13 100'%3E%3Cpath d='M 0 41 L 13 49 L 13 51 L 0 59 L 0 54.5 L 8 50 L 0 45.5 L 0 41'/%3E%3C/svg%3E"),linear-gradient(transparent, transparent)}.thread-right-control.collapsed.rightmost-page{visibility:hidden}.thread-right-control.collapsed:hover{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='black' stroke='none' viewBox='0 0 13 100'%3E%3Cpath d='M 0 41 L 13 49 L 13 51 L 0 59 L 0 54.5 L 8 50 L 0 45.5 L 0 41'/%3E%3C/svg%3E"),linear-gradient(to left, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.2))}.thread-right-control.collapsed:hover.dark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' stroke='none' viewBox='0 0 13 100'%3E%3Cpath d='M 0 41 L 13 49 L 13 51 L 0 59 L 0 54.5 L 8 50 L 0 45.5 L 0 41'/%3E%3C/svg%3E"),linear-gradient(to left, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.2))}.thread-viewport{box-sizing:border-box;display:flow-root;padding:0 !important;margin:0 !important;border:0 !important}.thread-scroll.collapsed{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-mask:linear-gradient(to right, transparent, black var(--thread-dynamic-left-peek), black calc(100% - var(--thread-dynamic-right-peek)), transparent);mask:linear-gradient(to right, transparent, black var(--thread-dynamic-left-peek), black calc(100% - var(--thread-dynamic-right-peek)), transparent)}.thread-scroll.collapsed:not(.debug){scrollbar-width:none}.thread-scroll.collapsed:not(.debug)::-webkit-scrollbar{display:none}.thread-scroll.collapsed.debug{overflow:scroll hidden;scrollbar-width:always}.thread-scroll.debug{background-color:rgba(0,0,0,.5)}.thread-layout{box-sizing:content-box;display:grid;grid-template-columns:repeat(auto-fill, var(--thread-dynamic-width));grid-auto-rows:var(--thread-dynamic-height);column-gap:var(--thread-dynamic-column-gap);row-gap:var(--thread-dynamic-row-gap);padding:0 calc(var(--thread-dynamic-column-gap) + var(--thread-dynamic-left-peek))}.thread-layout.collapsed{width:calc(var(--columns)*(var(--thread-dynamic-width) + var(--thread-dynamic-column-gap)) - var(--thread-dynamic-column-gap));height:calc(var(--rows)*(var(--thread-dynamic-height) + var(--thread-dynamic-row-gap)) - var(--thread-dynamic-row-gap))}.thread-tile{box-sizing:border-box;order:calc(var(--thread-order)*10000);scroll-margin-left:calc(var(--thread-dynamic-left-peek) + var(--thread-dynamic-column-gap));scroll-snap-align:start;width:var(--thread-dynamic-width);height:var(--thread-dynamic-height)}