:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Inter,sans-serif}*{box-sizing:border-box}body{color:#f8fafc;background:radial-gradient(circle at 20% 20%,#1e1b4b 0%,#0f172a 60%);justify-content:center;align-items:center;min-height:100vh;margin:0;padding:24px;display:flex}main{-webkit-backdrop-filter:blur(20px);text-align:center;background:#ffffff0a;border:1px solid #ffffff14;border-radius:24px;width:100%;max-width:480px;padding:48px 40px;box-shadow:0 25px 50px -12px #0009}h1{background:linear-gradient(45deg,#a855f7,#3b82f6);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0 0 8px;font-size:2rem;font-weight:800}.subtitle{color:#94a3b8;margin-bottom:32px;font-size:.95rem}input{color:#fff;background:#00000040;border:1px solid #ffffff1a;border-radius:10px;outline:none;padding:12px 14px;font-family:inherit;font-size:1rem;transition:border-color .2s,box-shadow .2s}input:focus{border-color:#a855f7;box-shadow:0 0 0 3px #a855f726}.button-row{gap:12px;margin-top:4px;display:flex}button{cursor:pointer;border:none;border-radius:10px;flex:1;padding:14px;font-family:inherit;font-size:1rem;font-weight:700;transition:transform .15s,box-shadow .15s,opacity .15s}button:active{transform:translateY(0)}button:disabled{opacity:.6;cursor:not-allowed;transform:none!important}.btn-primary{color:#fff;background:linear-gradient(45deg,#a855f7,#3b82f6)}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px -10px #a855f7}.btn-secondary{color:#cbd5e1;background:0 0;border:1px solid #ffffff26}.btn-secondary:hover:not(:disabled){background:#ffffff0f;border-color:#ffffff4d}.input-group{flex-direction:column;gap:18px;max-width:350px;margin:0 auto 24px;display:flex}.input-field{text-align:left;flex-direction:column;gap:6px;display:flex}.input-field label{color:#cbd5e1;text-transform:uppercase;letter-spacing:.05em;font-size:.85rem;font-weight:600}.barcode-wrapper{flex-direction:column;align-items:center;gap:16px;margin-top:8px;display:flex}.barcode-card{background:#fff;border-radius:12px;padding:4px;line-height:0;box-shadow:0 8px 24px -8px #0006}.barcode-card canvas{border-radius:8px;display:block}.btn-download{width:auto;padding:12px 24px}.resultado{border-top:1px solid #ffffff1a;margin-top:32px;padding-top:24px;animation:.3s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.resultado h3{color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;margin:0 0 16px;font-size:.95rem;font-weight:600}.ean-row{justify-content:center;align-items:center;gap:10px;margin-bottom:20px;display:flex}.ean-row code{letter-spacing:3px;background:#0000004d;border-radius:10px;padding:10px 18px;font-size:1.5rem;font-weight:700}.btn-copy{color:#93c5fd;background:#3b82f626;border:1px solid #3b82f64d;flex:none;padding:10px 16px}.btn-copy:hover{background:#3b82f640}