.sparte-tile{flex-direction:column;min-height:36rem;display:flex;position:relative;overflow:hidden}@media (min-width:64rem){.sparte-tile{flex:1 1 0;height:45rem;min-height:0}}@media (min-width:80rem) and (hover:hover) and (pointer:fine){.sparte-row{height:45rem;display:block;position:relative;container-type:inline-size}.sparte-tile{contain:layout paint;width:calc(58.333% - 6px);height:auto;transition:clip-path .3s var(--ease-out);position:absolute;inset-block:0}.sparte-left :is(.sparte-mid,.sparte-end),.sparte-right :is(.sparte-start,.sparte-mid){will-change:transform}.sparte-left{clip-path:inset(0 8.333cqw 0 0);left:0}.sparte-right{clip-path:inset(0 0 0 8.333cqw);right:0}.sparte-left :is(.sparte-mid,.sparte-end),.sparte-right :is(.sparte-start,.sparte-mid){transition:translate .3s var(--ease-out)}.sparte-left .sparte-mid{translate:-4.167cqw}.sparte-left .sparte-end{translate:-8.333cqw}.sparte-right .sparte-mid{translate:4.167cqw}.sparte-right .sparte-start{translate:8.333cqw}.sparte-row:has(.sparte-left:is(:hover,:focus-visible)) .sparte-left{clip-path:inset(0)}.sparte-row:has(.sparte-left:is(:hover,:focus-visible)) .sparte-left :is(.sparte-mid,.sparte-end){translate:0}.sparte-row:has(.sparte-left:is(:hover,:focus-visible)) .sparte-right{clip-path:inset(0 0 0 16.667cqw)}.sparte-row:has(.sparte-left:is(:hover,:focus-visible)) .sparte-right .sparte-mid{translate:8.333cqw}.sparte-row:has(.sparte-left:is(:hover,:focus-visible)) .sparte-right .sparte-start{translate:16.667cqw}.sparte-row:has(.sparte-right:is(:hover,:focus-visible)) .sparte-right{clip-path:inset(0)}.sparte-row:has(.sparte-right:is(:hover,:focus-visible)) .sparte-right :is(.sparte-start,.sparte-mid){translate:0}.sparte-row:has(.sparte-right:is(:hover,:focus-visible)) .sparte-left{clip-path:inset(0 16.667cqw 0 0)}.sparte-row:has(.sparte-right:is(:hover,:focus-visible)) .sparte-left .sparte-mid{translate:-8.333cqw}.sparte-row:has(.sparte-right:is(:hover,:focus-visible)) .sparte-left .sparte-end{translate:-16.667cqw}}.sparte-studio{background:radial-gradient(90% 70% at 50% 38%,#fff 0%,#f2f2f2 55%,#e3e3e3 100%)}.sparte-screen{inset-block:.5rem 0;aspect-ratio:390/844;position:absolute;left:50%;translate:-50%}.sparte-tile{--sparte-loop:12s}.sparte-row[data-gated]:not([data-playing]) :is(.sparte-screen,.sparte-selection,.sparte-size,.sparte-guide,.sparte-comment,.sparte-cursor,.sparte-cursor-body,.sparte-piece){animation-play-state:paused}.sparte-screen,.sparte-selection,.sparte-size,.sparte-guide,.sparte-comment,.sparte-cursor,.sparte-cursor-body,.sparte-piece{animation-duration:var(--sparte-loop);animation-timing-function:linear;animation-iteration-count:infinite}.sparte-screen{animation-name:sparte-drag}@keyframes sparte-drag{0%,17%{animation-timing-function:cubic-bezier(.34,1.3,.64,1);translate:calc(2.5rem - 50%) 1.5rem;rotate:-7deg}30%,90%{animation-timing-function:cubic-bezier(.65,0,.35,1);translate:-50%;rotate:none}to{translate:calc(2.5rem - 50%) 1.5rem;rotate:-7deg}}.sparte-selection{outline:1px solid var(--brand-accent);opacity:0;animation-name:sparte-select;position:absolute;inset:-1px}@keyframes sparte-select{0%,15.5%{opacity:0}16.5%,44%{opacity:1}48%,to{opacity:0}}.sparte-handle{border:1px solid var(--brand-accent);background:#fff;width:7px;height:7px;position:absolute}.sparte-size{background:var(--brand-accent);color:#fff;white-space:nowrap;opacity:0;border-radius:3px;padding:3px 6px;font-size:10px;font-weight:500;line-height:1;animation-name:sparte-snapped;position:absolute;bottom:-1.5rem;left:50%;translate:-50%}.sparte-guide{background:var(--brand-accent);opacity:0;animation-name:sparte-snapped;position:absolute}.sparte-guide-y{inset-block:0;width:1px;left:50%}.sparte-guide-x{inset-inline:0;height:1px;top:.5rem}@keyframes sparte-snapped{0%,29%{opacity:0}31%,42%{opacity:1}46%,to{opacity:0}}.sparte-cursor{opacity:0;position:absolute}.sparte-cursor-body{transform-origin:3px 3px;align-items:flex-start;margin:-3px 0 0 -3px;display:flex}.sparte-cursor-label{border-radius:var(--radius-nav);background:var(--cursor);color:var(--cursor-text,white);white-space:nowrap;margin:1.125rem 0 0 -.375rem;padding:3px 8px;font-size:13px;font-weight:500;line-height:1.3}.sparte-cursor-us{--cursor:var(--brand-accent);color:var(--cursor);animation-name:sparte-us-fade,sparte-us-move;top:18%;left:68%}.sparte-cursor-us .sparte-cursor-body{animation-name:sparte-us-press}@keyframes sparte-us-fade{0%,5%{opacity:0}9%,44%{opacity:1}50%,to{opacity:0}}@keyframes sparte-us-move{0%,5%{animation-timing-function:cubic-bezier(.2,.7,.3,1);translate:9rem 6rem}15%,40%{animation-timing-function:cubic-bezier(.5,0,.75,0);translate:0}50%,to{translate:9rem 5rem}}@keyframes sparte-us-press{0%,15%{scale:1}16%,38%{scale:.85}39.5%,to{scale:1}}.sparte-cursor-client{--cursor:var(--sparte-client);--cursor-text:var(--ink);color:var(--cursor);animation-name:sparte-client-fade,sparte-client-move;top:44%;left:14%}.sparte-cursor-client .sparte-cursor-body{animation-name:sparte-client-press}@keyframes sparte-client-fade{0%,48%{opacity:0}52%,70%{opacity:1}74%,to{opacity:0}}@keyframes sparte-client-move{0%,48%{animation-timing-function:cubic-bezier(.2,.7,.3,1);translate:-10rem 4rem}58%,64%{animation-timing-function:cubic-bezier(.5,0,.75,0);translate:0}74%,to{translate:-9rem 6rem}}@keyframes sparte-client-press{0%,58.5%{scale:1}59.5%{scale:.85}61%,to{scale:1}}.sparte-tile{--sparte-client:#98d949}.sparte-comment{transform-origin:0 0;align-items:flex-start;gap:8px;margin:8px 0 0 8px;animation-name:sparte-comment-fade,sparte-comment-pop;display:flex;position:absolute;top:44%;left:14%}.sparte-comment-pin{background:var(--sparte-client);width:2.25rem;height:2.25rem;color:var(--ink);box-shadow:var(--shadow-lift);border:2px solid #fff;border-radius:9999px 9999px 9999px 0;flex-shrink:0;place-items:center;font-size:14px;font-weight:600;display:grid}.sparte-comment-text{border-radius:0 var(--radius-card) var(--radius-card) var(--radius-card);width:max-content;max-width:13rem;color:var(--ink);box-shadow:var(--shadow-lift);background:#fff;padding:8px 12px;font-size:14px;line-height:1.35}@keyframes sparte-comment-fade{0%,60%{opacity:0}62%,92%{opacity:1}96%,to{opacity:0}}@keyframes sparte-comment-pop{0%,60%{animation-timing-function:cubic-bezier(.34,1.56,.64,1);scale:.6}65%,to{scale:1}}.sparte-board{pointer-events:none;position:absolute;inset:0;overflow:hidden}.sparte-piece{box-shadow:var(--shadow-lift);rotate:var(--r1);animation-name:sparte-tidy;position:absolute}@keyframes sparte-tidy{0%,17%{translate:var(--dx) var(--dy);rotate:var(--r0);animation-timing-function:cubic-bezier(.34,1.3,.64,1)}30%,90%{translate:0;rotate:var(--r1);animation-timing-function:cubic-bezier(.65,0,.35,1)}to{translate:var(--dx) var(--dy);rotate:var(--r0)}}.sparte-type{color:var(--ink);letter-spacing:-.025em;background:#fff;padding:1rem 1.5rem;font-size:4.5rem;font-weight:600;line-height:1}@media (max-width:39.99rem),(min-width:64rem) and (max-width:79.99rem){.sparte-type{display:none}}.sparte-sample{border-radius:var(--radius-nav);background:var(--sparte-client);color:#1d2a16;white-space:nowrap;padding:.625rem 1rem;font-size:.875rem;font-weight:600}.sparte-swatches{flex-direction:column;gap:.375rem;display:flex;position:absolute;top:46%;right:1.5rem}.sparte-swatch{background:var(--swatch);border:4px solid #fff;width:5rem;height:2.5rem;display:block;position:relative}@media (prefers-reduced-motion:reduce){.sparte-row :is(.sparte-tile,.sparte-mid,.sparte-start,.sparte-end){transition:none}.sparte-screen,.sparte-selection,.sparte-size,.sparte-guide,.sparte-comment,.sparte-cursor,.sparte-cursor-body,.sparte-piece{animation:none}}