*{margin:0;padding:0;box-sizing:border-box}body{font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;font-size:16px;line-height:1.5;background:#e8e8e8;min-height:100vh;padding:24px;color:#1a1a1a}.container{max-width:800px;margin:0 auto;background:#d4d4d4;border-radius:20px;box-shadow:0 20px 40px rgba(26,26,26,.15);overflow:hidden}.header{padding:40px 32px;text-align:center;color:linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%)}.header h1{font-size:40px;font-weight:700;margin-bottom:16px;line-height:1.2}.header p{font-size:20px;opacity:.9}.main-content{padding:32px 32px;background-color:#f5f5f5}.form-section{margin-bottom:32px;padding:32px;background:#f5f5f5;border-radius:15px;border:1px solid #d4d4d4}.form-group{margin-bottom:24px}.form-group:last-child{margin-bottom:0}label{display:block;margin-bottom:8px;font-weight:600;color:#1a1a1a;font-size:16px}input[type=text],input[type=url],textarea,select{width:100%;padding:16px;border:2px solid #d4d4d4 !important;border-radius:10px;font-size:16px;font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;transition:all .3s ease;background-color:#f5f5f5 !important}input[type=text]:focus,input[type=url]:focus,textarea:focus,select:focus{outline:none;border-color:#3b82f6 !important;background-color:#fff !important;box-shadow:0 0 0 3px rgba(59,130,246,.1)}input[type=text]:hover,input[type=url]:hover,textarea:hover,select:hover{border-color:#9e9e9e !important}input[type=text]::-moz-placeholder, input[type=url]::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder{color:#9e9e9e}input[type=text]::placeholder,input[type=url]::placeholder,textarea::placeholder,select::placeholder{color:#9e9e9e}textarea{resize:vertical;min-height:100px}.color-inputs{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:16px;background:#f5f5f5 !important;border-radius:10px;border:1px solid #d4d4d4}.color-group{display:flex;align-items:center;gap:16px;padding:8px}.color-group label{margin-bottom:0;font-size:14px;font-weight:400}.color-group .pcr-button{border:2px solid #d4d4d4 !important;border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.03);transition:all .3s ease}.color-group .pcr-button:hover{transform:scale(1.05);border-color:#9e9e9e !important;box-shadow:0 2px 4px rgba(0,0,0,.12),0 0 0 1px rgba(0,0,0,.05)}.color-group .pcr-button:focus{outline:none;border-color:#3b82f6 !important;box-shadow:0 0 0 3px rgba(59,130,246,.15)}input[type=color]{width:50px;height:40px;border:2px solid #d4d4d4 !important;border-radius:8px;cursor:pointer;transition:all .3s ease}input[type=color]:hover{transform:scale(1.05);border-color:#9e9e9e !important}input[type=color]:focus{outline:none;border-color:#3b82f6 !important;box-shadow:0 0 0 3px rgba(59,130,246,.1)}.generate-btn{background:#9e9e9e;color:#fff;border:2px solid #9e9e9e;padding:18px 50px;font-size:18px;font-weight:600;border-radius:50px;cursor:pointer;transition:all .3s ease;width:100%;margin-top:24px;font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif}.generate-btn:hover{background:#2d2d2d;border-color:#2d2d2d;transform:translateY(-2px);box-shadow:0 8px 20px rgba(59,130,246,.3)}.generate-btn:active{transform:translateY(0)}.generate-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.download-btn{background:#9e9e9e;color:#fff;border:2px solid #9e9e9e;padding:12px 30px;font-size:16px;font-weight:600;border-radius:25px;cursor:pointer;margin:16px;transition:all .3s ease;font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;box-shadow:0 1px 3px rgba(0,0,0,.12),0 0 0 1px rgba(0,0,0,.05)}.download-btn:hover{background:#000;border-color:#000;transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,.15),0 0 0 1px rgba(0,0,0,.08)}.download-btn:active{transform:translateY(0);box-shadow:0 1px 2px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.05)}.download-btn:focus{outline:none;box-shadow:0 1px 3px rgba(0,0,0,.12),0 0 0 3px rgba(59,130,246,.15)}.result-section{margin-top:40px;padding:32px;background:#e8e8e8;border-radius:15px;text-align:center;display:none}.result-section h3{font-size:24px;color:#1a1a1a;margin-bottom:24px}.qr-display{margin:24px 0;padding:24px;background:#fff;border-radius:10px;display:inline-block;box-shadow:0 5px 15px rgba(26,26,26,.15);transition:transform .3s ease}.qr-display:hover{transform:scale(1.02)}.qr-display canvas{display:block;border-radius:8px}.features{margin:32px 0}.features h3{font-size:24px;color:#1a1a1a;text-align:center;margin-bottom:24px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:20px;margin-top:24px}.feature-item{background:#f5f5f5;padding:24px;border-radius:10px;border:2px solid #d4d4d4;text-align:center;transition:all .3s ease}.feature-item:hover{transform:translateY(-3px);border-color:#9e9e9e;box-shadow:0 5px 15px rgba(26,26,26,.15);background-color:#d4d4d4}.feature-item h4{font-size:18px;color:#000;margin-bottom:8px}.feature-item p{color:#4a4a4a;line-height:1.5}.feature-icon{font-size:40px;margin-bottom:16px;line-height:1}.why-section{margin:64px 0 32px;padding:32px;background:#f5f5f5;border-radius:15px;border-left:4px solid #9e9e9e;box-shadow:0 5px 15px rgba(26,26,26,.15)}.why-section h3{font-size:24px;color:#1a1a1a;margin-bottom:24px;font-weight:700}.why-section p{color:#4a4a4a;line-height:1.5;margin-bottom:16px;font-size:16px}.why-section ul{list-style:none;margin:24px 0;padding-left:0}.why-section ul li{padding:8px 0;color:#2d2d2d;font-size:16px;line-height:1.5}.bottom-faq{margin:64px 0 32px;padding:32px;background:#e8e8e8;border-radius:15px;border:1px solid #d4d4d4}.bottom-faq h3{font-size:24px;color:#000;margin-bottom:32px;text-align:center;font-weight:700}.faq-item{padding:24px;margin-bottom:16px;background:#f5f5f5;border-radius:10px;border-left:3px solid #d4d4d4;transition:all .3s ease}.faq-item:hover{background:#e8e8e8;transform:translateY(-1px);box-shadow:0 2px 4px rgba(26,26,26,.1);border-left-color:#9e9e9e}.faq-item:last-child{margin-bottom:0}.faq-item p{margin-bottom:8px;line-height:1.5;color:#2d2d2d}.faq-item p:last-child{margin-bottom:0}.faq-item p strong{color:#000;font-weight:600}.bottom-benefits{margin:32px 0 8px;padding:40px;background:rgba(45,45,45,.75);color:#fff;border-radius:15px;text-align:center;box-shadow:0 10px 25px rgba(26,26,26,.2)}.bottom-benefits h3{font-size:32px;margin-bottom:32px;font-weight:700;color:#fff}.benefits-list{list-style:none;text-align:left;max-width:600px;margin:0 auto 32px;padding-left:0}.benefits-list li{padding:16px;margin-bottom:16px;background:hsla(0,0%,100%,.08);border-radius:10px;font-size:16px;line-height:1.5;transition:all .3s ease;border-left:3px solid rgba(0,0,0,0)}.benefits-list li:hover{background:hsla(0,0%,100%,.15);transform:translateY(-1px);border-left-color:#9e9e9e}.benefits-list li:last-child{margin-bottom:0}.benefits-list li strong{color:#fff;font-weight:700}.final-thought{font-size:18px;line-height:1.5;padding:24px;background:rgba(0,0,0,.3);border-radius:10px;margin-top:32px;border:1px solid hsla(0,0%,100%,.2)}.final-thought strong{color:#fff;font-weight:700}.credit{text-align:center;padding:32px 0;margin-top:64px;color:#f5f5f5;font-size:14px;border-top:1px solid #e8e8e8}.credit a{color:#9e9e9e;text-decoration:none;font-weight:600;transition:all .3s ease;position:relative}.credit a::after{content:"";position:absolute;width:0;height:1px;bottom:-2px;left:50%;background-color:#10b981;transition:all .3s ease;transform:translateX(-50%)}.credit a:hover{color:#10b981}.credit a:hover::after{width:100%}.credit a:focus{outline:none;color:#3b82f6}@media(max-width: 768px){.header{padding:32px 24px}.header h1{font-size:32px}.header p{font-size:18px}.main-content{padding:24px}.color-inputs{grid-template-columns:1fr;gap:16px}.color-group{justify-content:space-between}.stats-grid{grid-template-columns:1fr;gap:16px}.features-grid{grid-template-columns:1fr}.download-btn{display:block;width:100%;margin:8px 0}.why-section{padding:24px;margin:32px 0}.bottom-faq{padding:24px;margin:32px 0}.bottom-benefits{padding:24px;margin:8px 0}.bottom-benefits h3{font-size:24px}.benefits-list li{padding:8px}}@media(max-width: 576px){body{padding:16px}.header{padding:24px 16px}.header h1{font-size:24px}.main-content{padding:16px}.container{border-radius:10px}.why-section{padding:16px}.why-section h3{font-size:20px}.bottom-faq{padding:16px}.bottom-faq h3{font-size:20px}.faq-item{padding:16px}.bottom-benefits{padding:16px}.bottom-benefits h3{font-size:20px}.final-thought{padding:16px;font-size:16px}}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.mb-0{margin-bottom:0}.mb-1{margin-bottom:4px}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:16px}.mb-4{margin-bottom:24px}.mb-5{margin-bottom:32px}.mt-0{margin-top:0}.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:16px}.mt-4{margin-top:24px}.mt-5{margin-top:32px}.p-0{padding:0}.p-1{padding:4px}.p-2{padding:8px}.p-3{padding:16px}.p-4{padding:24px}.p-5{padding:32px}.fade-in{animation:fadeIn .5s ease-in}.slide-up{animation:slideUp .3s ease-out}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideUp{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.notification{position:fixed;top:24px;right:24px;padding:16px 24px;border-radius:8px;color:#fff;font-weight:600;z-index:1070;transform:translateX(100%);transition:transform .3s ease;box-shadow:0 5px 15px rgba(26,26,26,.15)}.notification.show{transform:translateX(0)}.notification-success{background:#10b981}.notification-warning{background:#d69e2e}.notification-error{background:#e53e3e}.notification-info{background:#000}