.motion-demo .st-gallery{position:relative;width:82%;height:170px;perspective:650px;display:grid;place-items:center}.st-gallery-cards{position:relative;width:110px;height:120px;transform-style:preserve-3d;animation:st-turn 8s ease-in-out infinite}.st-gallery-cards>span{position:absolute;inset:0;display:grid;place-items:end center;padding:11px 5px;border:2px solid var(--ink);border-radius:13px;background:#fffdf6;box-shadow:5px 6px 0 var(--ink);font-size:10px;font-weight:950;backface-visibility:visible;transform:rotateY(calc(var(--i)*72deg)) translateZ(95px)}.st-gallery-cards>span:nth-child(2){background:#ffd743}.st-gallery-cards>span:nth-child(3){background:#b7dfff}.st-gallery-cards>span:nth-child(4){background:#f8c4d3}.st-gallery-cards>span:nth-child(5){background:#d6e9c8}.st-gallery-cards>span i{position:absolute;inset:11px 12px 29px;border:2px solid var(--ink);border-radius:50% 50% 12px 12px;background:linear-gradient(135deg,transparent 47%,#fff8df 48%),#eac59a}.st-gallery>small{position:absolute;bottom:-5px;font-weight:900;font-size:10px;white-space:nowrap}.demo-depth-carousel .st-gallery-cards,.demo-fan-deck .st-gallery-cards,.demo-photo-stack .st-gallery-cards,.demo-spiral-slider .st-gallery-cards{animation:none;transform-style:flat}.demo-fan-deck .st-gallery-cards>span{transform-origin:50% 110%;transform:translateX(calc((var(--i) - 2)*7px)) rotate(calc((var(--i) - 2)*13deg));animation:st-fan 4s ease-in-out infinite;animation-delay:calc(var(--i)*.12s)}.demo-photo-stack .st-gallery-cards>span{transform:translate(calc(var(--i)*5px),calc(var(--i)*-3px)) rotate(calc((var(--i) - 2)*5deg));animation:st-stack 5s ease-in-out infinite;animation-delay:calc(var(--i)*-.9s)}.demo-depth-carousel .st-gallery-cards>span{transform:translateX(calc((var(--i) - 2)*42px)) translateZ(calc((2 - var(--i))*-18px)) rotateY(calc((var(--i) - 2)*-16deg)) scale(calc(1 - (var(--i) - 2)*(var(--i) - 2)*.08));animation:st-depth 5s ease-in-out infinite;animation-delay:calc(var(--i)*-.2s)}.demo-spiral-slider .st-gallery-cards>span{transform:translateX(calc((var(--i) - 2)*29px)) translateY(calc((var(--i) - 2)*(var(--i) - 2)*-8px)) rotate(calc((var(--i) - 2)*12deg)) scale(calc(1 - (var(--i) - 2)*(var(--i) - 2)*.09));animation:st-spiral 5s ease-in-out infinite;animation-delay:calc(var(--i)*-.17s)}.demo-orbit-gallery .st-gallery-cards{animation:st-orbit 8s linear infinite}.demo-orbit-gallery .st-gallery-cards>span{transform:rotate(calc(var(--i)*72deg)) translateY(-76px) rotate(calc(var(--i)*-72deg)) scale(.48)}.st-portal{position:relative;width:185px;height:145px;overflow:hidden;border:2px solid var(--ink);border-radius:15px;background:#b6d9f2;box-shadow:5px 6px 0 var(--ink);perspective:400px}.st-portal-back{position:absolute;inset:5px;display:grid;place-items:center;background:linear-gradient(145deg,#f9c2ce 50%,#ffe5a5 0);font-size:16px;font-weight:950}.st-portal-back i{position:absolute;top:8px;right:12px;font-style:normal}.st-portal-door{position:absolute;inset:14px 22px 0;display:grid;place-items:center;border:8px solid var(--ink);border-bottom:0;border-radius:70px 70px 0 0;background:#fffdf6;transform-origin:center bottom;animation:st-portal 4s ease-in-out infinite}.st-portal-door span{font-size:10px;font-weight:950}.st-portal small{position:absolute;bottom:6px;right:6px;font-size:8px;font-weight:950}.st-scene-index{display:flex;width:76%;height:132px;gap:9px}.st-scene-main{flex:1;position:relative;padding:12px;border:2px solid var(--ink);border-radius:13px;background:linear-gradient(135deg,#ffe0a4 45%,#b7dfff 0);box-shadow:4px 5px 0 var(--ink);animation:st-scene 4s steps(1) infinite}.st-scene-main b{font-size:40px}.st-scene-main span{position:absolute;bottom:10px;left:11px;font-size:10px;font-weight:900}.st-scene-thumbs{width:33px;display:grid;gap:5px}.st-scene-thumbs i{display:grid;place-items:center;border:2px solid var(--ink);border-radius:6px;background:#fff;font-size:9px;font-style:normal;font-weight:950}.st-scene-thumbs i:first-child{animation:st-thumb 4s steps(1) infinite}.st-scene-thumbs i:nth-child(2){animation:st-thumb 4s steps(1) -1.33s infinite}.st-scene-thumbs i:nth-child(3){animation:st-thumb 4s steps(1) -2.66s infinite}.st-3d-pose{height:150px;width:160px;display:grid;place-items:center;perspective:340px}.st-cube{width:86px;height:86px;position:relative;transform-style:preserve-3d;animation:st-cube 5s ease-in-out infinite}.st-cube span{position:absolute;inset:0;display:grid;place-items:center;border:2px solid var(--ink);border-radius:9px;background:#ffd743;font-size:12px;font-weight:950;box-shadow:4px 4px 0 var(--ink);backface-visibility:hidden}.st-cube span:first-child{transform:translateZ(43px)}.st-cube span:nth-child(2){transform:rotateY(90deg) translateZ(43px);background:#b7dfff}.st-cube span:nth-child(3){transform:rotateY(180deg) translateZ(43px);background:#f8c4d3}.st-cube span:nth-child(4){transform:rotateY(270deg) translateZ(43px);background:#d6e9c8}.st-3d-pose small{position:absolute;bottom:27px;font-size:9px;font-weight:950}.st-seam{position:relative;width:80%;height:135px;display:grid;overflow:hidden;border:2px solid var(--ink);border-radius:14px;box-shadow:4px 5px 0 var(--ink)}.st-seam>div{display:grid;place-items:center;font-size:12px;font-weight:950}.st-seam>div:first-child{background:#ffd743}.st-seam i,.st-seam>div:nth-child(2){background:#b7dfff}.st-seam i{position:absolute;left:10%;right:10%;top:50%;height:30px;border-top:3px solid var(--ink);border-radius:50% 50% 0 0;animation:st-seam 3.5s ease-in-out infinite}.st-intro{width:180px;height:120px;position:relative;display:grid;place-items:center;overflow:hidden;border:2px solid var(--ink);border-radius:14px;background:#fff;box-shadow:5px 6px 0 var(--ink)}.st-intro>span{z-index:1;font-size:22px;font-weight:950;animation:st-intro-text 4s ease-in-out infinite}.st-intro i{position:absolute;top:0;bottom:0;width:50%;background:#ffd743;animation:st-intro-door 4s ease-in-out infinite}.st-intro i:first-of-type{left:0;transform-origin:left}.st-intro i:nth-of-type(2){right:0;transform-origin:right;animation-name:st-intro-door-right}.st-pointer{position:relative;width:180px;height:126px}.st-pointer-picture{position:absolute;inset:2px 13px 8px 2px;display:grid;place-items:center;overflow:hidden;border:2px solid var(--ink);border-radius:13px;background:linear-gradient(135deg,#ffd743 0 48%,#f5b8c9 48% 68%,#b7dfff 68%);box-shadow:5px 6px 0 var(--ink)}.st-pointer-picture>span{font-size:50px}.st-pointer-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,1fr)}.st-pointer-grid i{border-right:1px solid rgba(48,39,25,.35);border-bottom:1px solid rgba(48,39,25,.35);animation:st-mesh 3.2s ease-in-out infinite}.st-pointer-grid i:nth-child(3n){animation-delay:.2s}.st-pointer-grid i:nth-child(4n){animation-delay:.4s}.st-pointer-cursor{position:absolute;right:0;bottom:0;font-size:36px;animation:st-cursor 3.2s ease-in-out infinite}.demo-elastic-frame .st-pointer-picture{background:#fff;animation:st-elastic 3.2s ease-in-out infinite}.demo-elastic-frame .st-pointer-grid{display:none}.demo-dither-lens .st-pointer-grid{border:2px solid var(--ink);border-radius:50%;width:72px;height:72px;inset:12px auto auto 54px;overflow:hidden;background:repeating-radial-gradient(circle,#302719 0 1px,transparent 2px 6px);opacity:.65;animation:st-lens 3.2s ease-in-out infinite}.demo-dither-lens .st-pointer-grid i{display:none}.st-keypress{width:125px;height:100px;display:grid;place-items:center;position:relative}.st-keypress span{display:grid;place-items:center;width:88px;height:70px;border:2px solid var(--ink);border-radius:15px;background:#fff;box-shadow:0 11px 0 #ac7a2f,0 13px 0 2px var(--ink);font-size:39px;font-weight:950;animation:st-key 2.4s ease-in-out infinite}.st-keypress small{position:absolute;bottom:-24px;font-size:9px;font-weight:950}.st-ready{display:flex;align-items:center;gap:8px;width:80%;height:80px}.st-ready>div{flex:1;padding:12px;border:2px solid var(--ink);border-radius:15px;background:#fff;box-shadow:4px 5px 0 var(--ink);font-size:10px}.st-ready>div i{display:inline-block;height:12px;border-right:2px solid var(--ink);animation:blink 1s infinite}.st-ready>b{display:grid;place-items:center;width:44px;height:44px;border:2px solid var(--ink);border-radius:50%;background:#eee4cd;font-size:22px;animation:st-ready 3s steps(1) infinite}.st-ready small{position:absolute;bottom:28px;left:36%;font-size:9px;font-weight:900}.st-card-rail{display:flex;width:82%;height:135px;gap:5px}.st-card-rail span{display:flex;flex:1;flex-direction:column;justify-content:space-between;overflow:hidden;padding:9px;border:2px solid var(--ink);border-radius:10px;background:#fff;font-size:11px;font-weight:950;animation:st-rail 6s ease-in-out infinite}.st-card-rail span:nth-child(2){background:#ffd743;animation-delay:-1.5s}.st-card-rail span:nth-child(3){background:#b7dfff;animation-delay:-3s}.st-card-rail span:nth-child(4){background:#f8c4d3;animation-delay:-4.5s}.st-card-rail b{font-size:8px;white-space:nowrap}.st-folder{position:relative;width:160px;height:125px;display:grid;place-items:end center}.st-folder>span{z-index:1;display:grid;place-items:center;width:110px;height:69px;border:2px solid var(--ink);border-radius:12px;background:#ffd743;box-shadow:5px 6px 0 var(--ink);font-size:35px}.st-folder>i{position:absolute;top:18px;left:35px;width:76px;height:64px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:10px;background:#fff;font-size:10px;font-style:normal;font-weight:950;animation:st-folder 4s ease-in-out infinite}.st-folder>i:nth-of-type(2){background:#b7dfff;animation-delay:-.2s}.st-folder>i:nth-of-type(3){background:#f8c4d3;animation-delay:-.4s}.st-folder small{position:absolute;bottom:-19px;font-size:9px;font-weight:950}.st-globe{display:grid;place-items:center;gap:9px}.st-globe>div{position:relative;width:126px;height:126px;overflow:hidden;border:3px solid var(--ink);border-radius:50%;background:#b7dfff;box-shadow:5px 6px 0 var(--ink);animation:st-globe 6s linear infinite}.st-globe i{position:absolute;left:calc((var(--x, 1))*11%);top:calc((var(--y, 1))*10%);width:9px;height:9px;border-radius:50%;background:var(--ink)}.st-globe i:first-child{--x:2;--y:2}.st-globe i:nth-child(2){--x:5;--y:2}.st-globe i:nth-child(3){--x:7;--y:3}.st-globe i:nth-child(4){--x:3;--y:4}.st-globe i:nth-child(5){--x:5;--y:5}.st-globe i:nth-child(6){--x:7;--y:6}.st-globe i:nth-child(7){--x:2;--y:7}.st-globe i:nth-child(8){--x:4;--y:8}.st-globe i:nth-child(9){--x:7;--y:8}.st-globe span{font-size:9px;font-weight:950}.st-blocks{width:150px;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;transform:rotateX(48deg) rotate(45deg);transform-style:preserve-3d}.st-blocks span{height:24px;border:2px solid var(--ink);background:#ffd743;box-shadow:4px 5px 0 #a5751c;animation:st-block 2.8s ease-in-out infinite;animation-delay:calc(var(--i)*.07s)}.st-blocks span:nth-child(3n){background:#b7dfff}.st-blocks span:nth-child(4n){background:#f8c4d3}.st-fluted{width:168px;height:125px;position:relative;overflow:hidden;border:2px solid var(--ink);border-radius:13px;box-shadow:5px 6px 0 var(--ink)}.st-fluted>div{height:100%;display:grid;place-items:center;background:linear-gradient(130deg,#b7dfff 42%,#ffd743 42% 72%,#f8c4d3 72%)}.st-fluted>div i{position:absolute;left:20px;top:15px;width:65px;height:80px;border:3px solid var(--ink);border-radius:50%;transform:rotate(-25deg)}.st-fluted b{z-index:1;font-size:15px;line-height:1.1;text-align:center}.st-fluted>span{position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.55) 0 4px,rgba(48,39,25,.16) 5px 7px,transparent 8px 14px);animation:st-flute 4s ease-in-out infinite}.st-tunnel{position:relative;width:180px;height:128px;overflow:hidden;perspective:300px;border:2px solid var(--ink);border-radius:13px;background:#fffdf6;box-shadow:5px 6px 0 var(--ink)}.st-tunnel span{position:absolute;inset:12px 21px;display:grid;place-items:center;border:3px solid var(--ink);border-radius:8px;background:linear-gradient(135deg,#ffd743 50%,#b7dfff 0);font-size:18px;font-weight:950;animation:st-tunnel 4s linear infinite;animation-delay:calc(var(--i, 0)*-1s)}.st-tunnel span:nth-child(2){--i:1}.st-tunnel span:nth-child(3){--i:2}.st-tunnel span:nth-child(4){--i:3}.st-tunnel b{position:absolute;bottom:5px;right:8px;font-size:20px}.st-focus-text,.st-warp-text{position:relative;display:flex;gap:7px;align-items:center;justify-content:center;width:80%;height:90px;border:2px solid var(--ink);border-radius:13px;background:#fff;box-shadow:5px 6px 0 var(--ink);font-size:20px;font-weight:950}.st-focus-text span{filter:blur(2px);animation:st-focus 3.6s steps(1) infinite}.st-focus-text span:nth-child(2){animation-delay:-1.2s}.st-focus-text span:nth-child(3){animation-delay:-2.4s}.st-focus-text i{position:absolute;left:10%;top:18px;width:27%;height:50px;border:3px solid #e5a900;border-radius:7px;animation:st-focus-box 3.6s steps(3) infinite}.st-warp-text span{animation:st-warp 3s ease-in-out infinite}.st-warp-text span:nth-child(2){animation-delay:.13s}.st-warp-text span:nth-child(3){animation-delay:.26s}@keyframes st-turn{0%,12%{transform:rotateY(0)}30%{transform:rotateY(-72deg)}48%{transform:rotateY(-144deg)}66%{transform:rotateY(-216deg)}84%,to{transform:rotateY(-1turn)}}@keyframes st-fan{0%,to{translate:0 0}35%,65%{translate:0 -15px}}@keyframes st-stack{0%,20%,to{translate:0 0}40%,55%{translate:54px -23px;rotate:17deg}75%{translate:0 0}}@keyframes st-depth{0%,to{translate:0 0}50%{translate:-20px 0}}@keyframes st-spiral{0%,to{translate:0 0}50%{translate:0 15px}}@keyframes st-orbit{to{transform:rotate(1turn)}}@keyframes st-portal{0%,15%,to{transform:translateZ(0) scale(1);opacity:1}45%,75%{transform:translateZ(210px) scale(2.4);opacity:.15}}@keyframes st-scene{0%,32%{filter:hue-rotate(0)}33%,65%{filter:hue-rotate(80deg)}66%,to{filter:hue-rotate(185deg)}}@keyframes st-thumb{0%,32%{background:#ffd743}33%,to{background:#fff}}@keyframes st-cube{0%,14%{transform:rotateY(0)}34%,48%{transform:rotateY(-90deg)}68%,82%{transform:rotateY(-180deg)}to{transform:rotateY(-1turn)}}@keyframes st-seam{0%,to{transform:scaleY(.1)}45%,65%{transform:scaleY(1.5)}}@keyframes st-intro-text{0%,18%{opacity:0;transform:translateY(8px)}28%,66%{opacity:1;transform:none}78%,to{opacity:0}}@keyframes st-intro-door{0%,45%{transform:scaleX(1)}75%,to{transform:scaleX(0)}}@keyframes st-intro-door-right{0%,45%{transform:scaleX(1)}75%,to{transform:scaleX(0)}}@keyframes st-mesh{0%,to{transform:none}45%{transform:translate(4px,-7px)}}@keyframes st-elastic{0%,to{border-radius:13px;transform:none}50%{border-radius:13px 38px 24px 13px;transform:skew(-3deg,2deg)}}@keyframes st-lens{0%,to{transform:translateX(-20px)}50%{transform:translateX(34px)}}@keyframes st-cursor{0%,to{transform:translate(-45px,-6px)}50%{transform:translate(-85px,-48px)}}@keyframes st-key{0%,22%,70%,to{transform:translateY(0);box-shadow:0 11px 0 #ac7a2f,0 13px 0 2px var(--ink)}32%,60%{transform:translateY(9px);box-shadow:0 2px 0 #ac7a2f,0 4px 0 2px var(--ink)}}@keyframes st-ready{0%,35%{background:#eee4cd;box-shadow:none}36%,to{background:#ffd743;box-shadow:0 0 0 7px rgba(255,215,67,.45)}}@keyframes st-rail{0%,15%,to{flex:1}30%,52%{flex:2.4}}@keyframes st-folder{0%,20%,to{transform:translate(0) rotate(0)}45%,70%{transform:translate(-24px,-28px) rotate(-14deg)}}@keyframes st-globe{0%{transform:rotateY(0)}50%{transform:rotateY(180deg)}to{transform:rotateY(1turn)}}@keyframes st-block{0%,to{transform:translateZ(0)}45%{transform:translateZ(16px);box-shadow:7px 10px 0 #a5751c}}@keyframes st-flute{0%,to{transform:translateX(0)}50%{transform:translateX(9px)}}@keyframes st-tunnel{0%{transform:translateZ(-250px);opacity:0}20%{opacity:1}80%{opacity:1}to{transform:translateZ(135px);opacity:0}}@keyframes st-focus{0%,32%{filter:none}33%,to{filter:blur(2px)}}@keyframes st-focus-box{0%{left:10%;width:27%}33%{left:36%;width:23%}66%{left:56%;width:35%}to{left:10%;width:27%}}@keyframes st-warp{0%,25%,to{transform:none;letter-spacing:0}42%,63%{transform:skew(-9deg,5deg) translateY(-7px);letter-spacing:2px}}@media(prefers-reduced-motion:reduce){.st-cube,.st-gallery-cards,.st-gallery-cards>span,.st-portal-door,.st-tunnel span{animation:none!important}.st-portal-door{opacity:0}.st-focus-text span{filter:none}.st-focus-text i{display:none}}.st-globe>div{animation:none}.st-globe>div:after,.st-globe>div:before{content:"";position:absolute;inset:0;border:2px solid rgba(48,39,25,.43);border-radius:50%}.st-globe>div:before{transform:scaleX(.48)}.st-globe>div:after{transform:scaleY(.48)}.st-globe i{animation:st-globe-dots 5s ease-in-out infinite}.st-globe i:nth-child(2n){animation-delay:-1.2s}.st-globe i:nth-child(3n){animation-delay:-2.4s}@keyframes st-globe-dots{0%,to{transform:translateX(-12px);opacity:.35}50%{transform:translateX(12px);opacity:1}}.st-depth-stage{position:relative;width:min(92%,290px);height:170px;perspective:600px;display:grid;place-items:center;overflow:visible}.st-depth-track{position:relative;width:94px;height:125px;transform-style:preserve-3d}.st-depth-track>span,.st-photo-stage>span{position:absolute;inset:0;display:grid;place-items:end center;padding:10px 6px;border:2px solid var(--ink);border-radius:13px;background:#fffdf6;box-shadow:4px 5px 0 var(--ink);font-size:11px;font-weight:950;backface-visibility:hidden}.st-depth-track>span:nth-child(2),.st-photo-stage>span:nth-child(2){background:#ffd743}.st-depth-track>span:nth-child(3),.st-photo-stage>span:nth-child(3){background:#b7dfff}.st-depth-track>span:nth-child(4){background:#f8c4d3}.st-depth-track>span:nth-child(5){background:#d6e9c8}.st-depth-track>span i,.st-photo-stage>span i{position:absolute;inset:10px 10px 27px;border:2px solid var(--ink);border-radius:45% 45% 10px 10px;background:linear-gradient(145deg,#fff8df 0 48%,#eac59a 49%)}.st-depth-track>span{animation:st-depth-slot 7.5s ease-in-out infinite;animation-delay:calc(var(--i)*-1.5s)}.st-depth-stage small,.st-photo-stage small{position:absolute;bottom:-4px;left:0;right:0;text-align:center;font-size:9px;font-weight:900;white-space:nowrap}.st-photo-stage{position:relative;width:105px;height:125px;margin-bottom:12px;perspective:550px}.st-photo-stage>span{animation:st-photo-cycle 6s ease-in-out infinite;animation-delay:calc(var(--i)*2s - 6s)}.st-photo-stage small{bottom:-28px;left:-55px;right:-55px}@keyframes st-photo-cycle{0%,27%{transform:translateZ(24px) rotate(0);z-index:3;opacity:1}36%,46%{transform:translate3d(94px,-28px,42px) rotate(19deg);z-index:3;opacity:1}55%,62%{transform:translate3d(12px,-8px,-36px) rotate(7deg);z-index:1;opacity:.72}67%,94%{transform:translate3d(8px,-5px,-18px) rotate(4deg);z-index:2;opacity:.9}to{transform:translateZ(24px) rotate(0);z-index:3;opacity:1}}.st-orbit-stage{position:relative;width:190px;height:155px;display:grid;place-items:center}.st-orbit-stage:before{content:"";position:absolute;width:145px;height:112px;border:2px dashed rgba(48,39,25,.45);border-radius:50%}.st-orbit-stage>b{z-index:2;display:grid;place-items:center;width:75px;height:55px;border:2px solid var(--ink);border-radius:12px;background:#fffdf6;text-align:center;line-height:1.1;font-size:12px;box-shadow:3px 4px 0 var(--ink)}.st-orbit-track{position:absolute;inset:0;animation:st-orbit 9s linear infinite}.st-orbit-track>span{position:absolute;top:calc(50% - 15px);left:calc(50% - 19px);width:38px;height:30px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:7px;background:#ffd743;font-size:9px;font-weight:950;box-shadow:2px 3px 0 var(--ink);transform:rotate(calc(var(--i)*72deg)) translateY(-66px) rotate(calc(var(--i)*-72deg));animation:st-orbit-upright 9s linear infinite}.st-orbit-track>span:nth-child(2){background:#b7dfff}.st-orbit-track>span:nth-child(3){background:#f8c4d3}.st-orbit-track>span:nth-child(4){background:#d6e9c8}.st-orbit-track>span:nth-child(5){background:#fffdf6}@keyframes st-orbit-upright{to{rotate:-1turn}}@media(prefers-reduced-motion:reduce){.st-depth-track>span,.st-orbit-track,.st-orbit-track>span,.st-photo-stage>span{animation:none!important}.st-depth-track>span{opacity:0}.st-depth-track>span:first-child{transform:translate3d(-62px,0,-40px) rotateY(22deg) scale(.8);opacity:.8;z-index:2}.st-depth-track>span:nth-child(2){transform:translateZ(38px) scale(1.12);opacity:1;z-index:5}.st-depth-track>span:nth-child(3){transform:translate3d(62px,0,-40px) rotateY(-22deg) scale(.8);opacity:.8;z-index:2}}.st-depth-stage{width:min(98%,310px)}@keyframes st-depth-slot{0%,2%{transform:translate3d(-120px,0,-115px) rotateY(46deg) scale(.58);opacity:.45;z-index:1}17%{transform:translate3d(-120px,0,-115px) rotateY(46deg) scale(.58);opacity:.45;z-index:1}20%,37%{transform:translate3d(-78px,0,-50px) rotateY(28deg) scale(.78);opacity:.84;z-index:3}40%,57%{transform:translateZ(42px) rotateY(0) scale(1.12);opacity:1;z-index:5}60%,77%{transform:translate3d(78px,0,-50px) rotateY(-28deg) scale(.78);opacity:.84;z-index:3}80%,97%{transform:translate3d(120px,0,-115px) rotateY(-46deg) scale(.58);opacity:.45;z-index:1}99%{transform:translate3d(132px,0,-130px) rotateY(-46deg) scale(.5);opacity:0;z-index:0}to{transform:translate3d(-132px,0,-130px) rotateY(46deg) scale(.5);opacity:0;z-index:0}}.demo-fan-deck .st-gallery-cards>span{animation:none!important;translate:0 0}.demo-fan-deck .st-gallery-cards>span:nth-child(3){z-index:5;animation:st-fan-focus 4s ease-in-out infinite!important}@keyframes st-fan-focus{0%,18%,82%,to{translate:0 0}34%,66%{translate:0 -21px}}.demo-spiral-slider .st-gallery-cards>span{animation:st-spiral-slot 7.5s ease-in-out infinite;animation-delay:calc(var(--i)*-1.5s)}@keyframes st-spiral-slot{0%,17%{transform:translate3d(-90px,31px,-110px) rotateY(40deg) rotate(-12deg) scale(.57);opacity:.5;z-index:1}20%,37%{transform:translate3d(-58px,-23px,-40px) rotateY(23deg) rotate(-7deg) scale(.76);opacity:.83;z-index:3}40%,57%{transform:translateZ(42px) rotateY(0) rotate(0) scale(1.08);opacity:1;z-index:5}60%,77%{transform:translate3d(58px,24px,-40px) rotateY(-23deg) rotate(7deg) scale(.76);opacity:.83;z-index:3}80%,97%{transform:translate3d(90px,-31px,-110px) rotateY(-40deg) rotate(12deg) scale(.57);opacity:.5;z-index:1}to{transform:translate3d(-90px,31px,-110px) rotateY(40deg) rotate(-12deg) scale(.57);opacity:0;z-index:1}}.st-scene-main{overflow:hidden}.st-scene-main>span{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:10px;background:linear-gradient(135deg,#ffe0a4 45%,#b7dfff 0);animation:st-scene-card 6s steps(1) infinite;animation-delay:calc(var(--i)*2s - 6s)}.st-scene-main>span:nth-child(2){background:linear-gradient(135deg,#f8c4d3 45%,#ffd743 0)}.st-scene-main>span:nth-child(3){background:linear-gradient(135deg,#b7dfff 45%,#d6e9c8 0)}.st-scene-main>span small{font-size:10px;font-weight:900}.st-scene-main>span b{font-size:40px}.st-scene-main{animation:none}.st-scene-thumbs i:first-child{animation:st-thumb 6s steps(1) infinite}.st-scene-thumbs i:nth-child(2){animation:st-thumb 6s steps(1) -4s infinite}.st-scene-thumbs i:nth-child(3){animation:st-thumb 6s steps(1) -2s infinite}@keyframes st-scene-card{0%,32%{opacity:1;z-index:2}33%,to{opacity:0;z-index:0}}.demo-mesh-warp .st-pointer-grid i{animation:none}.demo-mesh-warp .st-pointer-grid i:nth-child(15),.demo-mesh-warp .st-pointer-grid i:nth-child(16),.demo-mesh-warp .st-pointer-grid i:nth-child(21),.demo-mesh-warp .st-pointer-grid i:nth-child(22){animation:st-mesh-local 3.2s ease-in-out infinite}.demo-mesh-warp .st-pointer-grid i:nth-child(15),.demo-mesh-warp .st-pointer-grid i:nth-child(22){animation-delay:-.15s}@keyframes st-mesh-local{0%,20%,to{transform:none}48%,66%{transform:translate(7px,-8px) skew(-8deg,4deg)}}.st-warp-text{gap:0;white-space:pre}.st-warp-text span{display:inline-block;animation:st-warp-letter 3.6s ease-in-out infinite;animation-delay:calc(var(--i)*.06s)}.st-warp-text span:nth-child(3n){color:#b67d00}@keyframes st-warp-letter{0%,18%,80%,to{transform:none}36%,58%{transform:translateY(-6px) skew(-8deg,5deg)}}@media(prefers-reduced-motion:reduce){.demo-fan-deck .st-gallery-cards>span:nth-child(3){animation:none!important}.st-scene-main>span{animation:none;opacity:0}.st-scene-main>span:first-child{opacity:1}.demo-spiral-slider .st-gallery-cards>span{animation:none!important}}.semantic-scene{position:relative;width:78%;max-width:245px;height:145px;margin:auto;font-size:10px;font-weight:900;color:var(--ink)}.semantic-scene small{font-size:9px}.semantic-scene section,.semantic-scene>div,.semantic-scene>span{box-sizing:border-box}.semantic-swipe-actions{height:94px;margin:auto;background:#e7b4aa;border:2px solid var(--ink);border-radius:12px;overflow:hidden;box-shadow:4px 5px 0 var(--ink)}.semantic-actions{position:absolute;right:0;top:0;bottom:0;display:grid;place-items:center;width:91px;background:#f4a3a2;font-size:10px}.semantic-message{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding:12px;background:#fffdf6;animation:sem-swipe 4s ease-in-out infinite}.semantic-message span{font-size:9px;color:#8b7b62}@keyframes sem-swipe{0%,18%,88%,to{transform:none}36%,70%{transform:translateX(-91px)}}.semantic-pagination{display:grid;align-content:center;gap:12px}.semantic-results{display:grid;gap:5px}.semantic-results span{padding:5px 9px;border:2px solid var(--ink);border-radius:5px;background:#fff;animation:sem-page-row 5s steps(1) infinite}.semantic-results span:nth-child(2){animation-delay:-.12s}.semantic-results span:nth-child(3){animation-delay:-.24s}.semantic-pages{display:flex;justify-content:center;gap:7px}.semantic-pages>*{display:grid;place-items:center;width:23px;height:23px;border:2px solid var(--ink);border-radius:6px;font-style:normal;background:#fff}.semantic-pages b:nth-child(2){animation:sem-page-one 5s steps(1) infinite}.semantic-pages b:nth-child(3){animation:sem-page-two 5s steps(1) infinite}@keyframes sem-page-row{0%,49%,to{background:#fff}50%,90%{background:#b7dfff}}@keyframes sem-page-one{0%,49%,to{background:#ffd743}50%,90%{background:#fff}}@keyframes sem-page-two{0%,49%,to{background:#fff}50%,90%{background:#ffd743}}.semantic-shared{display:flex;align-items:center;justify-content:space-between;gap:20px}.semantic-detail-card,.semantic-list-card{width:78px;height:75px;border:2px solid var(--ink);border-radius:10px;background:#fff;padding:7px;box-shadow:3px 4px 0 var(--ink)}.semantic-detail-card{width:101px;height:116px;background:#b7dfff}.semantic-shared-image{position:absolute;top:54px;left:13px;z-index:2;display:grid;place-items:center;width:55px;height:48px;border:2px solid var(--ink);border-radius:8px;background:#ffd743;font-size:25px;animation:sem-shared 4s ease-in-out infinite}@keyframes sem-shared{0%,20%,88%,to{transform:translate(0) scale(1)}40%,70%{transform:translate(108px,-19px) scale(1.55)}}.semantic-layout{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-content:center}.semantic-layout span{display:grid;place-items:center;height:50px;border:2px solid var(--ink);border-radius:8px;background:#ffd743;box-shadow:3px 4px 0 var(--ink);animation:sem-layout-one 4s ease-in-out infinite}.semantic-layout span:nth-child(2){background:#b7dfff;animation-name:sem-layout-two}.semantic-layout span:nth-child(3){background:#f8c4d3;animation-name:sem-layout-three}.semantic-layout span:nth-child(4){background:#d6e9c8;animation-name:sem-layout-four}@keyframes sem-layout-one{0%,22%,80%,to{transform:none}40%,64%{transform:translateY(58px)}}@keyframes sem-layout-two{0%,22%,80%,to{transform:none}40%,64%{transform:translateX(calc(-100% - 8px))}}@keyframes sem-layout-three{0%,22%,80%,to{transform:none}40%,64%{transform:translateX(calc(-100% - 8px))}}@keyframes sem-layout-four{0%,22%,80%,to{transform:none}40%,64%{transform:translate(calc(200% + 16px),-58px)}}.semantic-dismiss{display:grid;align-content:center;overflow:hidden}.semantic-dismiss>span{padding:15px;border:2px solid var(--ink);border-radius:9px;background:#fff;box-shadow:4px 5px 0 var(--ink);animation:sem-dismiss 4s ease-in-out infinite}.semantic-dismiss small{text-align:center;margin-top:18px}@keyframes sem-dismiss{0%,15%,to{transform:none;opacity:1}47%,75%{transform:translateX(120%);opacity:0}}.semantic-masonry{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:35px;gap:6px;align-content:center}.semantic-masonry span{display:grid;place-items:center;border:2px solid var(--ink);border-radius:6px;background:#ffd743}.semantic-masonry span:nth-child(2){grid-row:span 2;background:#b7dfff}.semantic-masonry span:nth-child(3){background:#f8c4d3}.semantic-masonry span:nth-child(4){grid-row:span 2;background:#d6e9c8;animation:sem-masonry-fill 5s ease-in-out infinite}.semantic-masonry span:nth-child(5){background:#fff;animation:sem-masonry-tail 5s ease-in-out infinite}.semantic-masonry span:first-child{animation:sem-masonry-hide 5s ease-in-out infinite}@keyframes sem-masonry-hide{0%,20%,85%,to{opacity:1;transform:none}35%,70%{opacity:0;transform:scale(.5)}}@keyframes sem-masonry-fill{0%,25%,80%,to{transform:none}42%,65%{transform:translateY(-41px)}}@keyframes sem-masonry-tail{0%,25%,80%,to{transform:none}42%,65%{transform:translateX(calc(-100% - 6px))}}.semantic-context,.semantic-focus,.semantic-lightbox,.semantic-mega,.semantic-nested,.semantic-outside,.semantic-restoration,.semantic-scroll-lock,.semantic-sheet,.semantic-tour{overflow:hidden;border:2px solid var(--ink);border-radius:11px;background:#fff;box-shadow:4px 5px 0 var(--ink)}.semantic-focus>div{padding:12px;color:#9e988f}.semantic-focus section{position:absolute;inset:20px 21px 15px;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:8px;border:2px solid var(--ink);border-radius:8px;background:#fff6da;box-shadow:0 0 0 80px #30271977}.semantic-focus strong{width:100%;text-align:center;font-size:13px}.semantic-focus section span{padding:6px;border:2px solid var(--ink);border-radius:5px;background:#fff;animation:sem-focus 3s steps(1) infinite}.semantic-focus section span:last-child{animation-delay:-1.5s}.semantic-focus small{position:absolute;right:29px;bottom:18px}@keyframes sem-focus{0%,49%{outline:3px solid #2a78d4}50%,to{outline:none}}.semantic-page-lines{display:grid;gap:13px;padding:19px;animation:sem-stay 4s infinite}.semantic-page-lines i{height:8px;width:90%;border-radius:6px;background:#d1e7f5}.semantic-page-lines i:nth-child(2){width:65%}.semantic-scroll-lock section{position:absolute;inset:24px 30px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:9px;background:#ffd743;text-align:center;animation:sem-modal 4s ease-in-out infinite}.semantic-scroll-lock section small{font-size:8px}@keyframes sem-stay{to{transform:none}}@keyframes sem-modal{0%,15%,88%,to{opacity:0;transform:translateY(18px)}30%,75%{opacity:1;transform:none}}.semantic-lightbox,.semantic-thumb{display:grid;place-items:center}.semantic-thumb{width:60px;height:50px;border:2px solid var(--ink);border-radius:7px;background:#ffd743;font-size:25px}.semantic-lightbox-back{position:absolute;inset:0;display:grid;place-items:center;background:#302719bd;animation:sem-lightbox 4s ease-in-out infinite}.semantic-lightbox-back i{display:grid;place-items:center;width:75%;height:77%;border:2px solid var(--ink);border-radius:8px;background:#ffd743;font-size:42px;font-style:normal;animation:sem-lightbox-image 4s ease-in-out infinite}@keyframes sem-lightbox{0%,18%,85%,to{opacity:0}34%,72%{opacity:1}}@keyframes sem-lightbox-image{0%,18%,85%,to{transform:scale(.4)}34%,72%{transform:scale(1)}}.semantic-sheet{background:#b7dfff}.semantic-screen{padding:20px;text-align:center}.semantic-sheet section{position:absolute;left:0;right:0;bottom:0;height:100px;padding:12px;border-top:2px solid var(--ink);border-radius:12px 12px 0 0;background:#fffdf6;animation:sem-sheet 4s ease-in-out infinite}.semantic-sheet section i{display:block;width:35px;height:4px;margin:0 auto 10px;border-radius:3px;background:var(--ink)}.semantic-sheet section span{display:block;margin-top:15px}@keyframes sem-sheet{0%,17%,85%,to{transform:translateY(110%)}35%,70%{transform:none}}.semantic-notifications{display:grid;place-items:center}.semantic-notifications>b{position:relative;font-size:38px}.semantic-notifications>b i{position:absolute;right:-8px;top:1px;display:grid;place-items:center;width:18px;height:18px;border:2px solid var(--ink);border-radius:50%;background:#ffd743;font-size:9px;font-style:normal}.semantic-notifications section{position:absolute;top:7px;right:2px;width:150px;padding:10px;border:2px solid var(--ink);border-radius:8px;background:#fff;box-shadow:3px 4px 0 var(--ink);animation:sem-notify 4s ease-in-out infinite}.semantic-notifications section span{display:block;margin-top:6px;padding:5px;background:#fff3c9}@keyframes sem-notify{0%,20%,85%,to{opacity:0;transform:translateY(-12px) scale(.8)}35%,70%{opacity:1;transform:none}}.semantic-tour>div{display:flex;justify-content:space-around;padding:22px 8px}.semantic-tour>div span{padding:8px;border:2px solid var(--ink);border-radius:6px;background:#fff}.semantic-tour>i{position:absolute;top:17px;left:10px;width:65px;height:42px;border:3px solid #ffd743;border-radius:9px;box-shadow:0 0 0 100px #30271999;animation:sem-tour 6s steps(1) infinite}.semantic-tour>small{position:absolute;bottom:14px;left:22px;z-index:1;padding:6px;background:#fff;border-radius:5px}.semantic-tour>small b{animation:sem-tour-count 6s steps(1) infinite}@keyframes sem-tour{0%,32%{left:10px}33%,65%{left:calc(50% - 32px)}66%,to{left:calc(100% - 76px)}}@keyframes sem-tour-count{0%,32%{opacity:1}33%,65%{opacity:.6}66%,to{opacity:.3}}.semantic-pan{overflow:hidden;border:2px solid var(--ink);border-radius:10px;background-image:radial-gradient(#b8a98d 1px,transparent 0);background-size:14px 14px}.semantic-pan>div{position:absolute;inset:0;animation:sem-pan 4s ease-in-out infinite}.semantic-pan>div span{position:absolute;padding:8px;border:2px solid var(--ink);border-radius:7px;background:#ffd743}.semantic-pan>div span:first-child{left:8%;top:20%}.semantic-pan>div span:nth-child(2){left:44%;top:40%;background:#b7dfff}.semantic-pan>div span:nth-child(3){left:75%;top:12%;background:#f8c4d3}.semantic-pan>b{position:absolute;right:19%;bottom:18%;font-size:25px;animation:sem-cursor 4s ease-in-out infinite}.semantic-pan small{position:absolute;bottom:3px;left:4px;padding:2px;background:#fff}@keyframes sem-pan{0%,20%,90%,to{transform:none}40%,72%{transform:translate(-28px,18px)}}@keyframes sem-cursor{0%,20%,90%,to{transform:none}40%,72%{transform:translate(-28px,18px)}}.semantic-spy{display:flex;gap:7px}.semantic-spy nav{display:grid;align-content:center;gap:8px;width:48%;font-size:9px}.semantic-spy nav span{padding:7px;border:2px solid var(--ink);border-radius:5px;background:#fff}.semantic-spy nav span:nth-child(2){animation:sem-spy 6s steps(1) -2s infinite}.semantic-spy nav span:first-child{animation:sem-spy 6s steps(1) infinite}.semantic-spy nav span:nth-child(3){animation:sem-spy 6s steps(1) -4s infinite}.semantic-spy section{flex:1;overflow:hidden;display:grid;gap:6px;border:2px solid var(--ink);border-radius:6px;padding:8px;background:#fff;animation:sem-spy-scroll 6s ease-in-out infinite}.semantic-spy section i{height:24px;background:#b7dfff;border-radius:3px}@keyframes sem-spy{0%,31%{background:#ffd743}32%,to{background:#fff}}@keyframes sem-spy-scroll{0%,20%,to{transform:translateY(0)}45%,65%{transform:translateY(-8px)}75%,95%{transform:translateY(-16px)}}.semantic-breadcrumbs{display:flex;align-items:center;justify-content:center;gap:7px}.semantic-breadcrumbs span{padding:7px;border-bottom:2px solid var(--ink)}.semantic-breadcrumbs b{padding:8px;border:2px solid var(--ink);border-radius:5px;background:#ffd743}.semantic-breadcrumbs i{font-style:normal;font-size:16px}.semantic-stepper{display:grid;align-content:center;gap:13px}.semantic-stepper>div{display:flex;align-items:center;justify-content:center}.semantic-stepper span{display:grid;place-items:center;width:28px;height:28px;border:2px solid var(--ink);border-radius:50%;background:#fff;animation:sem-step 6s steps(1) infinite}.semantic-stepper span:first-child{background:#d6e9c8}.semantic-stepper span:nth-of-type(2){animation-delay:-2s}.semantic-stepper span:nth-of-type(3){animation-delay:-4s}.semantic-stepper i{height:2px;width:27px;background:var(--ink)}.semantic-stepper small{text-align:center}@keyframes sem-step{0%,32%{background:#ffd743;scale:1.13}33%,to{background:#fff;scale:1}}.semantic-restoration{padding:10px}.semantic-rest-list{display:grid;gap:6px;animation:sem-rest-list 6s steps(1) infinite}.semantic-rest-list b,.semantic-rest-list span{padding:5px;border-radius:4px;background:#d9eaf4}.semantic-rest-list b{background:#ffd743}.semantic-rest-detail{position:absolute;inset:0;display:grid;place-items:center;background:#f8c4d3;font-size:16px;text-align:center;animation:sem-rest-detail 6s steps(1) infinite}.semantic-rest-detail small{font-size:9px}@keyframes sem-rest-list{0%,25%,66%,to{transform:none}26%,65%{transform:translateY(-17px)}}@keyframes sem-rest-detail{0%,25%,66%,to{opacity:0}26%,65%{opacity:1}}.semantic-longpress{display:grid;place-items:center}.semantic-longpress>div{padding:25px;border:2px solid var(--ink);border-radius:8px;background:#ffd743}.semantic-longpress>div i{display:block;width:25px;height:25px;margin:auto;border:3px solid var(--ink);border-radius:50%;animation:sem-hold-ring 4s linear infinite}.semantic-longpress section{position:absolute;top:1px;right:0;padding:8px;border:2px solid var(--ink);border-radius:5px;background:#fff;animation:sem-menu 4s ease-in-out infinite}.semantic-longpress small{position:absolute;bottom:0}@keyframes sem-hold-ring{0%,10%,90%,to{border-top-color:transparent}40%,70%{border-color:#e39d00}}@keyframes sem-menu{0%,37%,90%,to{opacity:0;transform:scale(.8)}48%,78%{opacity:1;transform:none}}.semantic-swap{display:grid;place-items:center}.semantic-swap>span{position:absolute;display:grid;place-items:center;width:125px;height:105px;border:2px solid var(--ink);border-radius:10px;background:#ffd743;box-shadow:4px 5px 0 var(--ink);font-size:16px}.semantic-swap>span:nth-child(2){background:#b7dfff;animation:sem-swap 4s ease-in-out infinite}.semantic-swap>i{position:absolute;right:11px;bottom:3px;font-size:28px;font-style:normal;animation:sem-cursor-hover 4s ease-in-out infinite}@keyframes sem-swap{0%,20%,85%,to{opacity:0}36%,70%{opacity:1}}@keyframes sem-cursor-hover{0%,20%,85%,to{transform:translate(10px,6px)}36%,70%{transform:translate(-34px,-28px)}}.semantic-context{display:grid;place-items:center}.semantic-context>span{padding:24px;border:2px solid var(--ink);border-radius:8px;background:#ffd743}.semantic-context section{position:absolute;right:1px;bottom:3px;padding:8px 14px;border:2px solid var(--ink);border-radius:7px;background:#fff;line-height:2;animation:sem-menu 4s ease-in-out infinite}.semantic-context small{position:absolute;left:6px;bottom:3px}.semantic-mega header{padding:9px;border-bottom:2px solid var(--ink);background:#ffd743}.semantic-mega section{display:flex;gap:18px;padding:14px;background:#fff;animation:sem-mega 4s ease-in-out infinite}.semantic-mega section div{display:grid;gap:5px}.semantic-mega section b{font-size:11px}.semantic-mega section span{color:#625d50}@keyframes sem-mega{0%,18%,85%,to{transform:translateY(-110%);opacity:0}33%,70%{transform:none;opacity:1}}.semantic-nested section{position:absolute;inset:0;padding:17px;line-height:2.5;font-size:12px}.semantic-nested-first{background:#ffd743}.semantic-nested-second{background:#b7dfff;animation:sem-nested 4s ease-in-out infinite}@keyframes sem-nested{0%,18%,85%,to{transform:translateX(100%)}35%,70%{transform:none}}.semantic-outside{padding:13px}.semantic-outside button{padding:5px;border:2px solid var(--ink);border-radius:5px;background:#ffd743}.semantic-outside section{position:absolute;top:44px;left:13px;padding:8px 15px;border:2px solid var(--ink);border-radius:7px;background:#fff;line-height:2;animation:sem-outside 4s steps(1) infinite}.semantic-outside>i{position:absolute;right:20px;bottom:23px;font-size:24px;font-style:normal;animation:sem-outside-cursor 4s ease-in-out infinite}.semantic-outside small{position:absolute;right:5px;bottom:3px}@keyframes sem-outside{0%,23%,76%,to{opacity:0}24%,75%{opacity:1}}@keyframes sem-outside-cursor{0%,30%,to{transform:translate(-50px,-20px)}62%,80%{transform:none}}.semantic-shortcut{display:grid;align-content:center;justify-items:center;gap:13px}.semantic-shortcut>div{display:flex;align-items:center;gap:6px}.semantic-shortcut kbd{padding:9px 12px;border:2px solid var(--ink);border-radius:7px;background:#ffd743;box-shadow:0 5px 0 var(--ink);font:inherit;font-size:18px;animation:sem-keys 4s ease-in-out infinite}.semantic-shortcut kbd:last-child{animation-delay:.1s}.semantic-shortcut section{padding:9px 15px;border:2px solid var(--ink);border-radius:8px;background:#fff;animation:sem-shortcut-open 4s ease-in-out infinite}@keyframes sem-keys{0%,16%,80%,to{transform:none;box-shadow:0 5px 0 var(--ink)}28%,38%{transform:translateY(5px);box-shadow:none}}@keyframes sem-shortcut-open{0%,28%,85%,to{opacity:0;transform:translateY(10px)}42%,74%{opacity:1;transform:none}}.semantic-optimistic{display:grid;place-content:center;justify-items:center;gap:7px}.semantic-optimistic>b{font-size:48px;line-height:1;animation:sem-heart 4s steps(1) infinite}.semantic-optimistic>span{font-size:15px}.semantic-optimistic>span i{font-style:normal;animation:sem-count 4s steps(1) infinite}.semantic-optimistic small{text-align:center}@keyframes sem-heart{0%,15%,90%,to{color:var(--ink)}16%,89%{color:#e6677f;transform:scale(1.12)}}@keyframes sem-count{0%,15%,90%,to{opacity:.4}16%,89%{opacity:1}}.semantic-undo{display:grid;align-content:center;gap:11px}.semantic-undo>span{padding:14px;border:2px solid var(--ink);border-radius:8px;background:#fff;animation:sem-undo-row 5s ease-in-out infinite}.semantic-undo section{padding:8px;border:2px solid var(--ink);border-radius:7px;background:#302719;color:#fff;text-align:center;animation:sem-undo-toast 5s ease-in-out infinite}.semantic-undo section b{color:#ffd743;text-decoration:underline}@keyframes sem-undo-row{0%,18%,78%,to{opacity:1;transform:none}30%,67%{opacity:0;transform:translateX(80px)}}@keyframes sem-undo-toast{0%,24%,75%,to{opacity:0;transform:translateY(10px)}35%,65%{opacity:1;transform:none}}.semantic-overscroll{overflow:hidden;border:2px solid var(--ink);border-radius:9px;background:#fff}.semantic-overscroll>div{display:grid;gap:6px;padding:12px;animation:sem-overscroll 4s ease-in-out infinite}.semantic-overscroll span{padding:7px;background:#d9eaf4;border-radius:4px}.semantic-overscroll small{text-align:center}@keyframes sem-overscroll{0%,20%,to{transform:translateY(0)}45%{transform:translateY(-32px)}62%{transform:translateY(-25px)}76%{transform:translateY(-29px)}}@media(prefers-reduced-motion:reduce){.semantic-scene *{animation:none!important}.semantic-swipe-actions .semantic-message{transform:translateX(-91px)}.semantic-lightbox-back,.semantic-longpress section,.semantic-notifications section,.semantic-sheet section,.semantic-shortcut section{opacity:1;transform:none}.semantic-shared-image{transform:translate(108px,-19px) scale(1.55)}}.semantic-menubar{border:2px solid var(--ink);border-radius:9px;background:#fff;box-shadow:4px 5px 0 var(--ink)}.semantic-menubar>div{display:flex;justify-content:space-around;padding:8px;border-bottom:2px solid var(--ink);background:#ffd743}.semantic-menubar>div span:first-child{animation:sem-menu-active 4s steps(1) infinite}.semantic-menubar>div span:nth-child(2){animation:sem-menu-active 4s steps(1) -2.7s infinite}.semantic-menubar>div span:nth-child(3){animation:sem-menu-active 4s steps(1) -1.3s infinite}.semantic-menubar section{position:absolute;top:37px;left:8px;padding:7px 20px;border:2px solid var(--ink);border-radius:6px;background:#fff;line-height:1.7;animation:sem-menu-open 4s ease-in-out infinite}.semantic-menubar small{position:absolute;right:5px;bottom:3px}@keyframes sem-menu-active{0%,31%{background:#fff;border-radius:3px}32%,to{background:transparent}}@keyframes sem-menu-open{0%,15%,92%,to{opacity:0;transform:translateY(-8px)}30%,80%{opacity:1;transform:none}}.semantic-ring{display:grid;place-items:center}.semantic-ring svg{width:105px;height:105px;transform:rotate(-90deg)}.semantic-ring circle{fill:none;stroke:#d7ddce;stroke-width:9}.semantic-ring circle:nth-child(2){stroke:#79be8a;stroke-linecap:round;stroke-dasharray:226;animation:sem-ring-fill 4s ease-in-out infinite}.semantic-ring b{position:absolute;top:54px;font-size:18px;animation:sem-ring-label 4s steps(1) infinite}.semantic-ring small{position:absolute;bottom:0}@keyframes sem-ring-fill{0%,14%,to{stroke-dashoffset:226}65%,88%{stroke-dashoffset:56.5}}@keyframes sem-ring-label{0%,58%,to{opacity:0}59%,88%{opacity:1}}.semantic-countdown{display:grid;align-content:center;justify-items:center;gap:5px}.semantic-countdown>div{position:relative;width:69px;height:69px;border:4px solid var(--ink);border-radius:50%;background:#ffd743}.semantic-countdown>div span{position:absolute;inset:0;display:grid;place-items:center;font-size:31px;animation:sem-count-step 5s steps(1) infinite;animation-delay:calc(var(--i)*1s - 5s)}.semantic-countdown>b{font-size:12px}.semantic-countdown small{color:#756c5c}@keyframes sem-count-step{0%,19%{opacity:1}20%,to{opacity:0}}.semantic-tristate{display:grid;align-content:center;justify-items:center;gap:16px}.semantic-tristate>div{display:flex;align-items:center;gap:9px;padding:11px;border:2px solid var(--ink);border-radius:8px;background:#fff}.semantic-tristate i{position:relative;display:grid;place-items:center;width:26px;height:26px;border:2px solid var(--ink);border-radius:4px;background:#fff;font-style:normal;animation:sem-tristate 6s steps(1) infinite}.semantic-tristate i b,.semantic-tristate i em{position:absolute;font-style:normal;animation:sem-tristate-dash 6s steps(1) infinite}.semantic-tristate i b{animation-name:sem-tristate-check}.semantic-tristate small{text-align:center}@keyframes sem-tristate{0%,30%{background:#fff}31%,64%{background:#b7dfff}65%,to{background:#ffd743}}@keyframes sem-tristate-dash{0%,30%,65%,to{opacity:0}31%,64%{opacity:1}}@keyframes sem-tristate-check{0%,64%{opacity:0}65%,to{opacity:1}}.semantic-wavy{display:flex;align-items:center;justify-content:center;white-space:pre}.semantic-wavy span{display:inline-block;font-size:18px;animation:sem-letter-wave 3s ease-in-out infinite;animation-delay:calc(var(--i)*.1s)}@keyframes sem-letter-wave{0%,25%,80%,to{transform:none}45%,60%{transform:translateY(-10px)}}.semantic-handwriting{display:grid;place-items:center}.semantic-handwriting svg{width:100%;height:100px}.semantic-handwriting path{fill:none;stroke:var(--ink);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:340;animation:sem-handwrite 4s ease-in-out infinite}.semantic-handwriting small{position:absolute;bottom:0}@keyframes sem-handwrite{0%,13%,to{stroke-dashoffset:340}65%,86%{stroke-dashoffset:0}}.semantic-text-path{display:grid;place-items:center}.semantic-text-path svg{width:100%;height:100%;animation:sem-arc-rock 5s ease-in-out infinite}.semantic-text-path>svg>path{fill:none;stroke:#b7dfff;stroke-width:2;stroke-dasharray:4 4}.semantic-text-path text{fill:var(--ink);font-size:17px;font-weight:950;letter-spacing:2px}@keyframes sem-arc-rock{0%,to{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}@media(prefers-reduced-motion:reduce){.semantic-ring circle:nth-child(2){stroke-dashoffset:56.5}.semantic-ring b{opacity:1}.semantic-countdown>div span{opacity:0}.semantic-countdown>div span:first-child{opacity:1}}.semantic-virtual{overflow:hidden;border:2px solid var(--ink);border-radius:9px;background:#fff;padding:9px}.semantic-virtual>small{display:block;margin-bottom:6px}.semantic-virtual>div{display:grid;gap:4px;animation:sem-virtual-scroll 4s steps(2) infinite}.semantic-virtual>div span{padding:5px;background:#d9eaf4;border-radius:4px}.semantic-virtual>i{position:absolute;right:2px;top:36px;width:5px;height:30px;border-radius:3px;background:var(--ink);animation:sem-virtual-thumb 4s steps(2) infinite}@keyframes sem-virtual-scroll{0%,20%,to{transform:none}40%,75%{transform:translateY(-32px)}}@keyframes sem-virtual-thumb{0%,20%,to{top:36px}40%,75%{top:72px}}.semantic-load-more{display:grid;align-content:center;gap:8px}.semantic-load-more>div{display:grid;gap:4px}.semantic-load-more span{padding:5px;border:2px solid var(--ink);border-radius:5px;background:#fff}.semantic-load-more span:nth-child(n+3){animation:sem-load-row 4s ease-in-out infinite}.semantic-load-more span:nth-child(4){animation-delay:.15s}.semantic-load-more>b{justify-self:center;padding:6px 10px;border:2px solid var(--ink);border-radius:20px;background:#ffd743;animation:sem-load-button 4s steps(1) infinite}@keyframes sem-load-row{0%,32%,to{opacity:0;transform:translateY(-8px)}48%,82%{opacity:1;transform:none}}@keyframes sem-load-button{0%,32%,to{background:#ffd743}33%,47%{background:#c7c5bc}48%,82%{background:#d6e9c8}}.semantic-motion-path{display:grid;place-items:center}.semantic-motion-path svg{width:100%;height:105px}.semantic-motion-path path{fill:none;stroke:#a97c1c;stroke-width:3;stroke-dasharray:5 5}.semantic-motion-path>i{position:absolute;top:0;left:0;font-size:25px;font-style:normal;offset-path:path("M15 95 C65 95 65 20 120 37 S185 90 215 20");offset-rotate:auto;animation:sem-curve 4s ease-in-out infinite}.semantic-motion-path small{position:absolute;bottom:0}@keyframes sem-curve{0%,18%,to{offset-distance:0}67%,84%{offset-distance:100%}}.semantic-keyframes{display:grid;place-items:center}.semantic-keyframes>div{display:flex;justify-content:space-between;width:100%;border-top:2px dashed var(--ink);padding-top:8px}.semantic-keyframes>i{position:absolute;top:37px;left:0;font-size:28px;font-style:normal;animation:sem-keyframes 4s ease-in-out infinite}.semantic-keyframes small{position:absolute;bottom:0}@keyframes sem-keyframes{0%,16%,to{transform:translateY(20px) scale(.8)}42%,57%{transform:translate(85px,-8px) scale(1.25)}78%,88%{transform:translate(170px,20px) scale(.8)}}.semantic-delay{display:grid;align-content:center;gap:7px}.semantic-delay span{padding:8px;border:2px solid var(--ink);border-radius:7px;background:#fff;opacity:0;animation:sem-delay-item 4s ease-in-out infinite}.semantic-delay span:nth-child(2){animation-delay:.3s;background:#b7dfff}.semantic-delay span:nth-child(3){animation-delay:.6s;background:#ffd743}@keyframes sem-delay-item{0%,12%,to{opacity:0;transform:translateY(10px)}27%,82%{opacity:1;transform:none}}.semantic-duration{display:grid;align-content:center;gap:22px}.semantic-duration>div{position:relative;height:26px;border-bottom:2px dashed var(--ink)}.semantic-duration span{font-size:9px}.semantic-duration i{position:absolute;top:0;left:0;width:23px;height:23px;border:2px solid var(--ink);border-radius:50%;background:#ffd743;animation:sem-fast 4s ease-in-out infinite}.semantic-duration>div:nth-child(2) i{background:#b7dfff;animation:sem-slow 4s ease-in-out infinite}@keyframes sem-fast{0%,15%,85%,to{transform:none}22%,72%{transform:translateX(160px)}}@keyframes sem-slow{0%,15%,85%,to{transform:none}45%,72%{transform:translateX(160px)}}.semantic-double,.semantic-magnetic,.semantic-press{display:grid;place-items:center}.semantic-magnetic>span,.semantic-press>span{padding:18px;border:2px solid var(--ink);border-radius:30px;background:#ffd743;box-shadow:5px 6px 0 var(--ink);font-size:16px}.semantic-magnetic>span{animation:sem-magnetic 4s ease-in-out infinite}.semantic-double>i,.semantic-magnetic>i,.semantic-press>i{position:absolute;right:20px;bottom:18px;font-size:30px;font-style:normal;animation:sem-pointer-in 4s ease-in-out infinite}@keyframes sem-magnetic{0%,20%,85%,to{transform:none}43%,70%{transform:translate(18px,12px)}}@keyframes sem-pointer-in{0%,20%,85%,to{transform:none}43%,70%{transform:translate(-28px,-22px)}}.semantic-press>span{animation:sem-press 3s ease-in-out infinite}@keyframes sem-press{0%,20%,78%,to{transform:none;box-shadow:5px 6px 0 var(--ink)}35%,58%{transform:translate(4px,5px);box-shadow:1px 1px 0 var(--ink)}}.semantic-double>span{display:grid;place-items:center;width:95px;height:95px;border:2px solid var(--ink);border-radius:11px;background:#b7dfff;font-size:40px;animation:sem-double 4s ease-in-out infinite}.semantic-double small{position:absolute;bottom:0}@keyframes sem-double{0%,31%,84%,to{transform:scale(1)}42%,72%{transform:scale(1.45)}}.semantic-fab{overflow:hidden;border:2px solid var(--ink);border-radius:10px;background:#fff}.semantic-fab>div{display:grid;gap:12px;padding:18px;animation:sem-fab-scroll 4s ease-in-out infinite}.semantic-fab>div i{height:10px;width:75%;border-radius:4px;background:#d9eaf4}.semantic-fab>b{position:absolute;right:14px;bottom:15px;display:grid;place-items:center;width:43px;height:43px;border:2px solid var(--ink);border-radius:50%;background:#ffd743;font-size:25px;box-shadow:3px 4px 0 var(--ink)}.semantic-fab small{position:absolute;left:9px;bottom:3px;font-size:8px}@keyframes sem-fab-scroll{0%,20%,to{transform:none}45%,75%{transform:translateY(-25px)}}.semantic-dropdown,.semantic-popover{display:grid;justify-items:center;align-content:start;gap:8px;padding:13px}.semantic-dropdown>b,.semantic-popover>b{padding:8px 12px;border:2px solid var(--ink);border-radius:7px;background:#ffd743}.semantic-dropdown section,.semantic-popover section{padding:8px 15px;border:2px solid var(--ink);border-radius:7px;background:#fff;box-shadow:3px 4px 0 var(--ink);line-height:1.7;animation:sem-drop-menu 4s ease-in-out infinite}.semantic-popover section span{display:block}@keyframes sem-drop-menu{0%,18%,85%,to{opacity:0;transform:translateY(-8px) scale(.94)}34%,70%{opacity:1;transform:none}}.semantic-hotspot{display:grid;place-items:center}.semantic-hotspot>div{position:relative;width:145px;height:110px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:10px;background:linear-gradient(135deg,#b7dfff 0 50%,#ffd743 50%);box-shadow:4px 5px 0 var(--ink)}.semantic-hotspot>div span{position:absolute;display:grid;place-items:center;width:24px;height:24px;border:2px solid var(--ink);border-radius:50%;background:#fff}.semantic-hotspot>div span:first-child{left:15px;top:20px}.semantic-hotspot>div span:nth-child(2){right:22px;top:31px;animation:sem-hotspot 4s infinite}.semantic-hotspot>div span:nth-child(3){left:50px;bottom:8px}.semantic-hotspot aside{position:absolute;right:0;bottom:0;padding:6px;border:2px solid var(--ink);border-radius:5px;background:#fff;animation:sem-hotspot-note 4s ease-in-out infinite}@keyframes sem-hotspot{0%,20%,to{box-shadow:none}40%,75%{box-shadow:0 0 0 7px #fff9}}@keyframes sem-hotspot-note{0%,30%,85%,to{opacity:0;transform:translateY(6px)}42%,75%{opacity:1;transform:none}}.semantic-hover-card,.semantic-preview{display:grid;place-items:center}.semantic-hover-card>span,.semantic-preview>span{padding:8px;border-bottom:2px solid var(--ink)}.semantic-hover-card section,.semantic-preview section{position:absolute;bottom:0;right:0;display:grid;gap:5px;padding:9px;border:2px solid var(--ink);border-radius:7px;background:#fff;box-shadow:3px 4px 0 var(--ink);animation:sem-drop-menu 4s ease-in-out infinite}.semantic-preview section i{height:35px;background:#b7dfff;border-radius:4px}.semantic-hover-card section small{font-size:8px}@media(prefers-reduced-motion:reduce){.semantic-delay span,.semantic-dropdown section,.semantic-hover-card section,.semantic-load-more span:nth-child(n+3),.semantic-popover section,.semantic-preview section{opacity:1;transform:none}.semantic-motion-path>i{offset-distance:100%}}.semantic-count-up{display:grid;align-content:center;justify-items:center}.semantic-count-up>div{position:relative;width:150px;height:75px}.semantic-count-up>div span{position:absolute;inset:0;display:grid;place-items:center;font-size:68px;line-height:1;font-weight:950;animation:sem-count-number 4s steps(1) infinite;animation-delay:calc(var(--i)*1s - 4s)}.semantic-count-up small{text-align:center}@keyframes sem-count-number{0%,24%{opacity:1}25%,to{opacity:0}}.semantic-scramble{display:grid;place-items:center}.semantic-scramble span{position:absolute;padding:14px;border:2px solid var(--ink);border-radius:8px;background:#fff;font-size:20px;letter-spacing:2px;animation:sem-scramble-stage 3.6s steps(1) infinite}.semantic-scramble span:nth-child(2){animation-delay:-2.4s}.semantic-scramble span:nth-child(3){animation-delay:-1.2s}@keyframes sem-scramble-stage{0%,32%{opacity:1}33%,to{opacity:0}}.semantic-anchor{display:flex;gap:8px}.semantic-anchor nav{display:grid;align-content:center;gap:5px;width:45%}.semantic-anchor nav span{padding:7px;border:2px solid var(--ink);border-radius:5px;background:#fff}.semantic-anchor nav span:nth-child(2){background:#ffd743}.semantic-anchor>div{flex:1;display:grid;align-content:center;gap:7px;overflow:hidden;border:2px solid var(--ink);border-radius:7px;padding:8px;background:#fff}.semantic-anchor>div b{padding:4px;background:#b7dfff}.semantic-anchor>div b,.semantic-anchor>div i{animation:sem-anchor-jump 4s ease-in-out infinite}.semantic-anchor>div i{height:8px;background:#e5e1d5;border-radius:3px}@keyframes sem-anchor-jump{0%,23%,to{transform:translateY(50px)}40%,80%{transform:none}}.semantic-cursor-follow{display:grid;place-items:center}.semantic-cursor-follow>b{position:absolute;top:20px;left:35px;font-size:35px;animation:sem-follow-cursor 4s ease-in-out infinite}.semantic-cursor-follow>span{position:absolute;top:55px;left:65px;padding:8px;border:2px solid var(--ink);border-radius:20px;background:#ffd743;animation:sem-follow-tag 4s ease-in-out infinite}.semantic-cursor-follow small{position:absolute;bottom:0}@keyframes sem-follow-cursor{0%,15%,to{transform:none}47%,75%{transform:translate(105px,40px)}}@keyframes sem-follow-tag{0%,20%,to{transform:none}53%,80%{transform:translate(105px,40px)}}.semantic-particles{overflow:hidden;border:2px solid var(--ink);border-radius:9px;background:#fffdf6}.semantic-particles>i{position:absolute;width:6px;height:6px;left:calc(var(--x)*1%);top:calc(var(--y)*1%);border-radius:50%;background:#c4a844;animation:sem-particle 3.5s ease-in-out infinite;animation-delay:calc(var(--i)*-.12s)}.semantic-particles>b{position:absolute;right:20px;bottom:19px;font-size:29px}@keyframes sem-particle{0%,to{transform:none}50%{transform:translate(7px,-8px)}}.semantic-hover-lift,.semantic-hover-lift>span{display:grid;place-items:center}.semantic-hover-lift>span{width:105px;height:115px;border:2px solid var(--ink);border-radius:12px;background:#b7dfff;box-shadow:5px 7px 0 var(--ink);animation:sem-lift 4s ease-in-out infinite}.semantic-hover-lift>i{position:absolute;right:25px;bottom:9px;font-size:28px;font-style:normal;animation:sem-pointer-in 4s ease-in-out infinite}@keyframes sem-lift{0%,20%,85%,to{transform:none;box-shadow:5px 7px 0 var(--ink)}40%,70%{transform:translateY(-15px);box-shadow:8px 16px 0 #3027199a}}.semantic-rotate,.semantic-rotate>span{display:grid;place-items:center}.semantic-rotate>span{width:95px;height:95px;border:2px solid var(--ink);border-radius:13px;background:#ffd743;font-size:42px;animation:sem-rotate 4s ease-in-out infinite}.semantic-rotate>b,.semantic-rotate>i{position:absolute;font-size:20px;font-style:normal}.semantic-rotate>i{left:42px;top:37px;animation:sem-finger-one 4s ease-in-out infinite}.semantic-rotate>b{right:38px;bottom:32px;animation:sem-finger-two 4s ease-in-out infinite}.semantic-rotate small{position:absolute;bottom:0}@keyframes sem-rotate{0%,18%,85%,to{transform:none}46%,68%{transform:rotate(48deg)}}@keyframes sem-finger-one{0%,18%,85%,to{transform:none}46%,68%{transform:translate(19px,-14px)}}@keyframes sem-finger-two{0%,18%,85%,to{transform:none}46%,68%{transform:translate(-19px,14px)}}@media(prefers-reduced-motion:reduce){.semantic-count-up>div span,.semantic-scramble span{opacity:0}.semantic-count-up>div span:last-child,.semantic-scramble span:last-child{opacity:1}}