*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(135deg,#667eea 0,#764ba2 100%);min-height:100vh;padding:20px}.container{max-width:1000px;margin:0 auto;background:#fff;border-radius:10px;box-shadow:0 10px 40px rgba(0,0,0,.2);padding:40px}header{text-align:center;margin-bottom:40px}header h1{color:#333;font-size:2.5em;margin-bottom:10px}header p{color:#666;font-size:1.1em}.tabs{display:flex;gap:10px;margin-bottom:30px;border-bottom:2px solid #eee;flex-wrap:wrap}.tab-btn{padding:12px 24px;border:none;background:0 0;cursor:pointer;font-size:1em;color:#666;border-bottom:3px solid transparent;transition:.3s}.tab-btn:hover{color:#667eea;border-bottom-color:#667eea}.tab-btn.active{color:#667eea;border-bottom-color:#667eea;font-weight:600}.tab-content{display:none;animation:.3s fadeIn}.tab-content.active{display:block}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.tab-content h2{color:#333;margin-bottom:25px;font-size:1.5em}.form-group{margin-bottom:20px}label{display:block;color:#333;font-weight:600;margin-bottom:8px}input[type=color],input[type=file],input[type=text],select{width:100%;padding:12px;border:2px solid #eee;border-radius:5px;font-size:1em;transition:border-color .3s}input[type=color]:focus,input[type=file]:focus,input[type=text]:focus,select:focus{outline:0;border-color:#667eea}input[type=range]{width:calc(100% - 60px);margin-right:15px}#angleValue{color:#667eea;font-weight:600;min-width:50px;text-align:right}small{display:block;color:#999;margin-top:5px;font-size:.9em}.checkbox-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px}.checkbox-group label{display:flex;align-items:center;margin-bottom:0;font-weight:400;cursor:pointer}.checkbox-group input[type=checkbox]{width:auto;margin-right:8px;cursor:pointer}.btn{padding:12px 30px;border:none;border-radius:5px;font-size:1em;cursor:pointer;transition:.3s;font-weight:600}.btn-primary{background:linear-gradient(135deg,#667eea 0,#764ba2 100%);color:#fff;margin-top:10px}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 5px 20px rgba(102,126,234,.4)}.btn-secondary{background:#f0f0f0;color:#333}.btn-secondary:hover{background:#e0e0e0}.emoji-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(50px,1fr));gap:10px;margin-top:15px}.emoji-btn{font-size:2em;padding:10px;border:2px solid #eee;border-radius:5px;cursor:pointer;text-align:center;transition:.2s;user-select:none}.emoji-btn:hover{border-color:#667eea;transform:scale(1.1);background:#f5f5f5}.preview-container{margin-top:30px;padding-top:30px;border-top:2px solid #eee}.preview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px}.icon-preview{text-align:center}.icon-preview canvas{border:1px solid #eee;border-radius:5px;max-width:100%;height:auto;margin-bottom:10px}.icon-preview p{color:#666;font-weight:600;margin-bottom:8px}.download-btn{background:#27ae60;color:#fff;padding:8px 15px;border:none;border-radius:3px;cursor:pointer;font-size:.9em;transition:background .3s}.download-btn:hover{background:#229954}.info-section{background:#f8f9fa;padding:20px;border-radius:5px;margin-top:40px}.info-section h3{color:#333;margin-bottom:15px}.info-section ul{list-style:none}.info-section li{color:#666;padding:8px 0;border-bottom:1px solid #eee}.info-section li:last-child{border-bottom:none}.success-msg{background:#d4edda;border:1px solid #c3e6cb;color:#155724;padding:12px;border-radius:5px;margin-bottom:15px}.error-msg{background:#f8d7da;border:1px solid #f5c6cb;color:#721c24;padding:12px;border-radius:5px;margin-bottom:15px}@media (max-width:600px){.container{padding:20px}header h1{font-size:1.8em}.tabs{flex-direction:column;gap:0;border-bottom:none}.tab-btn{border-bottom:2px solid #eee;border-right:none}.tab-btn.active{border-bottom-color:#667eea}.preview-grid{grid-template-columns:1fr}}