:root{--preview-color:#7925ff;--layout:white;--background:#fff;--layout-border:#f0f0f0;--layout-hover:#f9f9f9;--text-color:#49454e;--color:black}.dark-theme{--layout:var(--preview-background-color);--background:black;--color:white;--layout-border:#3a3535;--layout-hover:#3a3535}.animation-container{justify-content:center;align-items:center;padding:2rem;display:flex}.animation-select{border-color:var(--border-color);color:var(--text-color);background-color:var(--background-color)}.animation-select:focus-visible{outline:none}.animation-box{background-color:var(--preview-bg-color);width:130px;height:130px;color:var(--preview-color);border-radius:8px;justify-content:center;align-items:center;font-size:1.2rem;display:flex}.animation-demo-container{width:100%;max-width:600px;margin:0 auto;padding:1rem}.animation-status{text-align:center;background-color:#f5f5f5;border-radius:4px;margin:1rem 0;padding:.5rem;font-weight:500}.animation-box-special{color:#fff;background:linear-gradient(135deg,#7366ff,#2196f3);border-radius:8px;width:300px;height:120px;overflow:hidden;box-shadow:0 6px 16px #00000026}.animation-content{align-items:center;height:100%;padding:0 1.5rem;display:flex}.animation-icon{margin-right:1rem;font-size:2.5rem}.animation-text h3{margin:0 0 .5rem;font-size:1.2rem}.animation-text p{opacity:.9;margin:0;font-size:.9rem}.fixed-width-button{text-align:center;min-width:90px}