.animations-page{min-height:100vh;background:#000;padding:2rem 1.5rem 4rem;overflow-y:auto}.animations-header{text-align:center;margin-bottom:3rem}.animations-title{font-size:2.5rem;color:#fff;letter-spacing:-.04em;margin:0 0 .5rem}.animations-subtitle{color:#666;font-size:.85rem;margin:0}.animations-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:2rem;max-width:1200px;margin:0 auto}.animation-card{background:#0a0a0a;border:1px solid #1a1a1a;border-radius:16px;padding:2rem;display:flex;flex-direction:column;align-items:center;transition:border-color .3s ease,box-shadow .3s ease}.animation-card:hover{border-color:#333;box-shadow:0 0 40px #52b7880f}.animation-stage{width:280px;height:200px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;margin-bottom:1.5rem}.animation-label{font-size:1.1rem;color:#fff;margin:0 0 .35rem;letter-spacing:-.02em}.animation-desc{font-size:.75rem;color:#555;margin:0;text-align:center;line-height:1.5}.back-link{display:inline-flex;align-items:center;gap:.5rem;color:#52b788;font-size:.85rem;text-decoration:none;transition:opacity .2s;margin-bottom:2rem}.back-link:hover{opacity:.7}.cascade-container{display:flex;align-items:flex-end;gap:4px;height:160px}.cascade-column{display:flex;flex-direction:column-reverse;gap:3px}.cascade-block{width:28px;height:28px;border-radius:4px;opacity:0;transform:translateY(-120px);animation:cascadeFall 3s ease-in infinite;position:relative;overflow:hidden}.cascade-block:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(255,255,255,.25) 0%,transparent 50%)}.cascade-block:before{content:"";position:absolute;inset:1px;border-radius:3px;border:1px solid rgba(255,255,255,.15)}@keyframes cascadeFall{0%{opacity:0;transform:translateY(-120px) scale(.8)}8%{opacity:1;transform:translateY(-120px) scale(1)}25%{opacity:1;transform:translateY(0) scale(1)}30%{transform:translateY(-6px) scale(1.02)}35%{transform:translateY(0) scale(1)}70%{opacity:1;transform:translateY(0) scale(1)}85%{opacity:0;transform:translateY(0) scale(.85)}to{opacity:0;transform:translateY(-120px) scale(.8)}}.cascade-column:nth-child(1) .cascade-block{animation-delay:0s}.cascade-column:nth-child(2) .cascade-block{animation-delay:.15s}.cascade-column:nth-child(3) .cascade-block{animation-delay:.3s}.cascade-column:nth-child(4) .cascade-block{animation-delay:.45s}.cascade-column:nth-child(5) .cascade-block{animation-delay:.6s}.cascade-column:nth-child(6) .cascade-block{animation-delay:.75s}.cascade-block:nth-child(2){animation-delay:calc(var(--col-delay, 0s) + .12s)!important}.cascade-block:nth-child(3){animation-delay:calc(var(--col-delay, 0s) + .24s)!important}.cascade-column:nth-child(1){--col-delay: 0s}.cascade-column:nth-child(2){--col-delay: .15s}.cascade-column:nth-child(3){--col-delay: .3s}.cascade-column:nth-child(4){--col-delay: .45s}.cascade-column:nth-child(5){--col-delay: .6s}.cascade-column:nth-child(6){--col-delay: .75s}.typewriter-container{display:flex;align-items:center;justify-content:center;font-size:2.2rem;letter-spacing:-.04em;position:relative;height:60px}.typewriter-track{display:inline-flex;overflow:hidden}.typewriter-letter{display:inline-block;opacity:0;transform:translateY(8px);animation:typeReveal 4.8s ease infinite;font-weight:700}@keyframes typeReveal{0%{opacity:0;transform:translateY(8px) scale(.9)}4%{opacity:1;transform:translateY(0) scale(1)}50%{opacity:1;transform:translateY(0) scale(1)}56%{opacity:1;transform:translateY(0) scale(1.05)}62%{opacity:0;transform:translateY(-12px) scale(.9)}to{opacity:0;transform:translateY(8px) scale(.9)}}.typewriter-letter:nth-child(1){animation-delay:0s}.typewriter-letter:nth-child(2){animation-delay:.12s}.typewriter-letter:nth-child(3){animation-delay:.24s}.typewriter-letter:nth-child(4){animation-delay:.36s}.typewriter-letter:nth-child(5){animation-delay:.48s}.typewriter-letter:nth-child(6){animation-delay:.6s}.typewriter-letter:nth-child(7){animation-delay:.72s}.typewriter-letter:nth-child(8){animation-delay:.84s}.typewriter-cursor{display:inline-block;width:2px;height:1.2em;background:#52b788;margin-left:2px;animation:cursorBlink .6s ease-in-out infinite alternate,cursorTravel 4.8s ease infinite;vertical-align:text-bottom;border-radius:1px;box-shadow:0 0 8px #52b78899}@keyframes cursorBlink{0%{opacity:1}to{opacity:.2}}@keyframes cursorTravel{0%,2%{transform:translate(0)}18%{transform:translate(0)}62%,68%{transform:translate(0)}to{transform:translate(0)}}.grid-assembly{display:grid;grid-template-columns:repeat(var(--grid-cols, 8),1fr);grid-template-rows:repeat(var(--grid-rows, 8),1fr);gap:3px;width:180px;height:180px}.grid-cell{border-radius:3px;background:#111;animation:cellPulse 3.2s ease infinite;opacity:.15;position:relative}.grid-cell:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(255,255,255,.2) 0%,transparent 60%);opacity:0;animation:cellShine 3.2s ease infinite}.grid-assembly--game-start{width:100%;height:100%;gap:0}.grid-cell--game-start{border-radius:0;opacity:0;animation:cellAssembleReveal .46s cubic-bezier(.22,1,.36,1) forwards}.grid-cell--game-start:after{animation:cellAssembleShine .46s ease-out forwards}@keyframes cellPulse{0%{opacity:.08;transform:scale(.6)}20%{opacity:1;transform:scale(1)}50%{opacity:1;transform:scale(1)}70%{opacity:.3;transform:scale(.9)}to{opacity:.08;transform:scale(.6)}}@keyframes cellShine{0%{opacity:0}20%{opacity:1}50%{opacity:.5}70%{opacity:0}to{opacity:0}}@keyframes cellAssembleReveal{0%{opacity:0;transform:scale(.92)}24%{opacity:1;transform:scale(1)}72%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1)}}@keyframes cellAssembleShine{0%{opacity:0}18%{opacity:.7}55%{opacity:.22}to{opacity:0}}.word-rain-container{position:relative;width:260px;height:180px;overflow:hidden;mask-image:linear-gradient(to bottom,transparent 0%,black 15%,black 85%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 15%,black 85%,transparent 100%)}.rain-word{position:absolute;font-size:.7rem;font-weight:500;white-space:nowrap;opacity:0;animation:wordFall linear infinite;text-shadow:0 0 10px currentColor;letter-spacing:.02em}@keyframes wordFall{0%{opacity:0;transform:translateY(-30px)}5%{opacity:.8}90%{opacity:.6}to{opacity:0;transform:translateY(210px)}}.tetromino-stage{position:relative;width:160px;height:160px}.tetromino-cell{position:absolute;width:34px;height:34px;border-radius:5px;transition:none;animation-timing-function:cubic-bezier(.4,0,.2,1);animation-duration:8s;animation-iteration-count:infinite;will-change:transform}.tetromino-cell:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%)}.tetromino-cell:before{content:"";position:absolute;inset:2px;border-radius:3px;border:1px solid rgba(255,255,255,.12)}.tetromino-cell-0{animation-name:morphCell0}.tetromino-cell-1{animation-name:morphCell1}.tetromino-cell-2{animation-name:morphCell2}.tetromino-cell-3{animation-name:morphCell3}@keyframes morphCell0{0%,5%{left:12px;top:63px;transform:scale(1) rotate(0)}20%,30%{left:12px;top:25px;transform:scale(1) rotate(90deg)}45%,55%{left:50px;top:63px;transform:scale(1) rotate(180deg)}70%,80%{left:12px;top:25px;transform:scale(1) rotate(270deg)}95%,to{left:12px;top:63px;transform:scale(1) rotate(360deg)}}@keyframes morphCell1{0%,5%{left:50px;top:25px;transform:scale(1) rotate(0)}20%,30%{left:50px;top:25px;transform:scale(1) rotate(90deg)}45%,55%{left:88px;top:63px;transform:scale(1) rotate(180deg)}70%,80%{left:50px;top:25px;transform:scale(1) rotate(270deg)}95%,to{left:50px;top:25px;transform:scale(1) rotate(360deg)}}@keyframes morphCell2{0%,5%{left:50px;top:63px;transform:scale(1) rotate(0)}20%,30%{left:88px;top:25px;transform:scale(1) rotate(90deg)}45%,55%{left:12px;top:25px;transform:scale(1) rotate(180deg)}70%,80%{left:88px;top:25px;transform:scale(1) rotate(270deg)}95%,to{left:50px;top:63px;transform:scale(1) rotate(360deg)}}@keyframes morphCell3{0%,5%{left:88px;top:63px;transform:scale(1) rotate(0)}20%,30%{left:88px;top:63px;transform:scale(1) rotate(90deg)}45%,55%{left:12px;top:25px;transform:scale(.95) rotate(180deg)}70%,80%{left:126px;top:25px;transform:scale(1) rotate(270deg)}95%,to{left:88px;top:63px;transform:scale(1) rotate(360deg)}}.tetromino-stage:after{content:"";position:absolute;inset:-20px;border-radius:50%;background:radial-gradient(circle,rgba(106,82,183,.08) 0%,transparent 70%);pointer-events:none;animation:stageGlow 8s ease infinite}@keyframes stageGlow{0%,to{opacity:.5}25%{opacity:1}50%{opacity:.3}75%{opacity:.8}}@media(prefers-reduced-motion:reduce){.cascade-block,.typewriter-letter,.typewriter-cursor,.grid-cell,.grid-cell:after,.rain-word,.tetromino-cell,.tetromino-stage:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}