*{margin:0;padding:0;box-sizing:border-box}body{font-family:Roboto,Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden}.app-container{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);position:relative;overflow:hidden}.app-container:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(120,119,198,.3) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(252,70,107,.2) 0%,transparent 50%),radial-gradient(circle at 40% 90%,rgba(120,219,226,.2) 0%,transparent 50%);animation:gradientShift 15s ease infinite}@keyframes gradientShift{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.1)}}.header-section{text-align:center;margin-bottom:2.5rem;position:relative;z-index:1}.icon-wrapper{display:inline-flex;padding:1rem;background:#ffffff26;border-radius:50%;margin-bottom:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.header-icon{font-size:3rem!important;color:#fff;filter:drop-shadow(0 4px 6px rgba(0,0,0,.2))}.main-title{color:#fff;font-weight:800!important;text-shadow:0 4px 12px rgba(0,0,0,.2);margin-bottom:.5rem!important;letter-spacing:-.5px;animation:fadeInDown .8s ease-out}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.subtitle{color:#fffffff2!important;font-weight:400!important;text-shadow:0 2px 8px rgba(0,0,0,.15);animation:fadeInUp 1s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.main-card{padding:2.5rem!important;border-radius:24px!important;background:#fffffffa!important;-webkit-backdrop-filter:blur(20px)!important;backdrop-filter:blur(20px)!important;box-shadow:0 20px 60px #0000004d!important;transition:all .4s cubic-bezier(.4,0,.2,1)!important;position:relative;z-index:1}.main-card:hover{transform:translateY(-4px);box-shadow:0 24px 70px #00000059!important}.input-section,.output-section{margin-bottom:2rem}.output-section{padding-top:2rem;border-top:2px solid #f0f0f0;animation:slideInUp .6s ease-out}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.section-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem}.section-icon{font-size:1.75rem!important;color:#667eea;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.success-icon{color:#4caf50!important}.section-title{color:#2c3e50;font-weight:700!important;font-size:1.25rem!important}.text-field{animation:fadeIn .5s ease-out}.text-field .MuiOutlinedInput-root{border-radius:12px!important;background:#fafafa;transition:all .3s ease!important}.text-field .MuiOutlinedInput-root:hover{background:#f5f5f5;box-shadow:0 4px 12px #00000014}.text-field .MuiOutlinedInput-root.Mui-focused{background:#fff;box-shadow:0 6px 20px #667eea26}.output-field .MuiOutlinedInput-root{background:#f8f9ff!important;border:2px solid #e8ecff}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.select-field{border-radius:12px!important;background:#fafafa!important;transition:all .3s ease!important}.select-field:hover{background:#f5f5f5!important;box-shadow:0 4px 12px #00000014!important}.button-group{display:flex;gap:1rem;flex-wrap:wrap}.generate-btn{background:linear-gradient(135deg,#667eea,#764ba2)!important;color:#fff!important;padding:14px 32px!important;border-radius:12px!important;font-weight:600!important;font-size:1rem!important;text-transform:none!important;box-shadow:0 8px 20px #667eea66!important;transition:all .3s cubic-bezier(.4,0,.2,1)!important;position:relative;overflow:hidden}.generate-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s}.generate-btn:hover:before{left:100%}.generate-btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px #667eea80!important}.generate-btn:active{transform:translateY(0)}.generate-btn:disabled{background:linear-gradient(135deg,#b0b0b0,#909090)!important;box-shadow:none!important}.copy-btn{background:linear-gradient(135deg,#11998e,#38ef7d)!important;color:#fff!important;padding:14px 32px!important;border-radius:12px!important;font-weight:600!important;font-size:1rem!important;text-transform:none!important;box-shadow:0 8px 20px #11998e66!important;transition:all .3s cubic-bezier(.4,0,.2,1)!important}.copy-btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px #11998e80!important}.clear-btn{border:2px solid #667eea!important;color:#667eea!important;padding:12px 28px!important;border-radius:12px!important;font-weight:600!important;text-transform:none!important;transition:all .3s ease!important}.clear-btn:hover{background:#667eea!important;color:#fff!important;transform:translateY(-2px);box-shadow:0 8px 20px #667eea4d!important}@media(max-width:900px){.main-card{padding:2rem!important}}@media(max-width:600px){.app-container:before{animation:none}.main-card{padding:1.5rem!important;border-radius:20px!important}.header-section{margin-bottom:2rem}.icon-wrapper{padding:.75rem}.header-icon{font-size:2.5rem!important}.section-icon{font-size:1.5rem!important}.section-title{font-size:1.1rem!important}.button-group{flex-direction:column}.generate-btn,.copy-btn,.clear-btn{width:100%;padding:12px 24px!important}.text-field .MuiInputBase-root{font-size:.9rem}}@media(max-width:400px){.main-card{padding:1.25rem!important;border-radius:16px!important}.main-title{font-size:1.5rem!important}.subtitle{font-size:.875rem!important}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}html{scroll-behavior:smooth}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#764ba2,#667eea)}