.review-demo-container{max-width:500px;margin:0 auto;padding:2rem 1rem;background:white;border-radius:12px;box-shadow:0 4px 20px #0000001a;overflow:hidden}.demo-header{text-align:center;margin-bottom:2rem}.demo-title{color:#2c3e50;font-weight:700;margin-bottom:.5rem;font-size:1.75rem}.demo-subtitle{color:#6c757d;font-size:1rem;margin:0}.demo-progress{padding:0 1rem}.progress-steps{display:flex;align-items:center;justify-content:center;margin-bottom:1rem}.step-indicator{display:flex;align-items:center}.step-circle{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;background:#e9ecef;color:#6c757d;border:2px solid #dee2e6;transition:all .4s cubic-bezier(.4,0,.2,1)}.step-circle.active{background:#007bff;color:#fff;border-color:#007bff;transform:scale(1.1);box-shadow:0 0 0 4px #007bff33}.step-circle.loading{background:#6c757d;color:#adb5bd;border-color:#6c757d;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.step-line{width:40px;height:2px;background:#dee2e6;margin:0 8px;transition:all .4s ease}.step-line.active{background:#007bff;transform:scaleX(1.2)}.step-label{text-align:center;font-weight:600;color:#007bff;margin-bottom:1rem;font-size:1.1rem;min-height:1.5rem}.demo-content{min-height:260px;position:relative}.demo-step{animation:fadeInUp .6s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.step-question{color:#2c3e50;font-weight:600;margin-bottom:.75rem;font-size:1.25rem}.step-instruction{color:#6c757d;margin-bottom:1.5rem;font-size:.95rem;line-height:1.5}.tag-container{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center}.demo-tag{padding:.5rem 1rem;font-size:.9rem;font-weight:500;border-radius:20px;cursor:default;transition:all .3s cubic-bezier(.4,0,.2,1);transform:scale(1)}.demo-tag.selected{transform:scale(1.05);box-shadow:0 4px 12px #007bff4d;animation:tagSelect .4s ease-out}@keyframes tagSelect{0%{transform:scale(1)}50%{transform:scale(1.15)}to{transform:scale(1.05)}}.text-input-demo{background:#f8f9fa;border:2px solid #e9ecef;border-radius:8px;padding:1rem;min-height:120px;position:relative}.input-placeholder{color:#495057;font-size:1rem;line-height:1.6;font-family:inherit;white-space:pre-wrap;word-wrap:break-word}.typing-cursor{color:#007bff;font-weight:700;animation:blink 1s infinite}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.summary-content{background:#f8f9fa;border-radius:8px;padding:1.5rem}.summary-section{margin-bottom:1.5rem}.summary-section:last-child{margin-bottom:0}.summary-section strong{color:#2c3e50;display:block;margin-bottom:.75rem;font-size:1rem}.summary-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}.summary-tag{font-size:.8rem;padding:.25rem .75rem}.summary-text{color:#6c757d;margin:0;line-height:1.5;font-size:.95rem}.success-step{text-align:center;padding:2rem 1rem}.success-icon{width:80px;height:80px;background:#28a745;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:40px;margin:0 auto 1.5rem;animation:successBounce .8s cubic-bezier(.68,-.55,.265,1.55)}@keyframes successBounce{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}.success-title{color:#28a745;font-weight:700;margin-bottom:1rem;font-size:1.5rem}.success-message{color:#6c757d;font-size:1rem;line-height:1.5;max-width:400px;margin:0 auto}@media (max-width: 768px){.review-demo-container{padding:1.5rem 1rem;margin:1rem .5rem 0}.demo-title{font-size:1.5rem}.demo-subtitle{font-size:.9rem}.step-circle{width:28px;height:28px;font-size:12px}.step-line{width:30px}.tag-container{gap:.5rem}.demo-tag{padding:.4rem .8rem;font-size:.85rem}.success-icon{width:60px;height:60px;font-size:30px}.success-title{font-size:1.25rem}.step-question{font-size:1.1rem}.step-instruction{font-size:.9rem}}@media (max-width: 576px){.review-demo-container{padding:1rem .75rem;margin:1rem .25rem 0}.demo-title{font-size:1.3rem}.demo-subtitle{font-size:.85rem}.step-circle{width:24px;height:24px;font-size:11px}.step-line{width:25px}.tag-container{gap:.4rem}.demo-tag{padding:.3rem .7rem;font-size:.8rem}}*{transition:color .2s ease,background-color .2s ease,border-color .2s ease}.demo-tag:hover{transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}.demo-step{position:relative}.demo-step:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transform:translate(-100%);animation:shimmer 2s infinite}@keyframes shimmer{to{transform:translate(100%)}}
